从Go Server渲染React

I am currently rendering a webpack build file (bundle.js) through a Go server. How can I make my build files hot reload, or what do I need to do in order to serve hot reload files from the Go server?

When I use the 'npm run start' script, I am told that the webpack output is served from http://localhost:3000/dist/

and the project output is from http://localhost:3000

My directory is as follows

+ public
  - bundle.js
+ src
  - App.js
  - index.js
- index.html
- package.json
- server.go
- webpack.config.js

// index.html

<!DOCTYPE html>
<html>

<head>
  <meta charset="UTF-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
  <title>React Starter</title>
</head>

<body>
  <div id="root"></div>
  <noscript>
    You need to enable JavaScript to run this app.
  </noscript>
  <script src="/public/bundle.js"></script> 
</body>

</html>

// webpack config

const path = require("path");
const webpack = require("webpack");

module.exports = {
  entry: "./src/index.js",
  mode: "development",
  module: {
    rules: [
      {
        test: /\.(js|jsx)$/,
        exclude: /(node_modules|bower_components)/,
        loader: "babel-loader",
        options: { presets: ["@babel/env"] }
      },
      {
        test: /\.css$/,
        use: ["style-loader", "css-loader"]
      }
    ]
  },
  resolve: { extensions: ["*", ".js", ".jsx"] },
  output: {
    path: path.join(__dirname, "/public"),
    publicPath: "/public/",
    filename: "bundle.js"
  },
  devServer: {
    contentBase: path.join(__dirname, "/"),
    port: 3000,
    publicPath: "http://localhost:3000/dist/",
    hotOnly: true
  },
  plugins: [new webpack.HotModuleReplacementPlugin()]
};

// package.json

{
  "name": "r-proj",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "start": "webpack-dev-server --mode development",
    "build": "webpack --mode development",
    "a": "webpack-dev-server --content-base src --hot --inline"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "@babel/cli": "^7.1.0",
    "@babel/core": "^7.1.0",
    "@babel/preset-env": "^7.1.0",
    "@babel/preset-react": "^7.0.0",
    "babel-loader": "^8.0.2",
    "css-loader": "^1.0.0",
    "style-loader": "^0.23.0",
    "webpack": "^4.19.1",
    "webpack-cli": "^3.1.1",
    "webpack-dev-server": "^3.1.8"
  },
  "dependencies": {
    "react": "^16.5.2",
    "react-dom": "^16.5.2"
  }
}

// server.go

func handler(w http.ResponseWriter, r *http.Request) {
  t, _ := template.ParseFiles("./index.html")
  t.Execute(w, "")
}

func main() {
  http.HandleFunc("/", handler)
  fs := http.FileServer(http.Dir("./public/"))

  http.Handle("/public/", http.StripPrefix("/public", fs)) 

  log.Fatal(http.ListenAndServe(":8080", nil))
}

Thank you.

dsdf64562672
dsdf64562672 但是您的Go服务器在端口8080上运行,如果我正确读取配置,则go服务器正在从webpack构建输出保存到的公共文件夹中提供文件。因此,尝试在端口8080上访问您的Web应用。并确保您不要忽略template.ParseFiles中的错误。
一年多之前 回复
doujiu3097
doujiu3097 Webpack开发服务器将其托管在3000
一年多之前 回复
dongqing4774
dongqing4774 您如何访问自己的Web应用程序?在哪个端口上?
一年多之前 回复
dsvtnz6350
dsvtnz6350 这就是我遇到的麻烦。您能告诉我需要对webpack和server.go文件进行哪些更改才能从/dist提供服务,因为它无法找到该文件。
一年多之前 回复
douhuan5073
douhuan5073 您当然可以使用/dist服务,创建一个文件服务器处理程序,然后注册它,就像使用/public一样。但是,这不会在更改时自动重新热加载浏览器,您必须手动刷新页面,或者使用前面评论中建议的第三方包。
一年多之前 回复
dongre6270
dongre6270 我目前正在提供/public/bundle.js输出文件。您知道是否有可能服务/dist指定的devserver输出吗?这样我可以使用React的热重装吗?
一年多之前 回复
douwu5009
douwu5009 Go及其标准库没有为热重装提供现成的解决方案。如果要使用Go服务器进行热重装,则必须寻找第3方软件包。google的第一个结果指向github.com/cosmtrek/air,如果这不符合您的需求,则您必须搜索更多互联网。
一年多之前 回复
Csdn user default icon
上传中...
上传图片
插入图片
抄袭、复制答案,以达到刷声望分或其他目的的行为,在CSDN问答是严格禁止的,一经发现立刻封号。是时候展现真正的技术了!
立即提问
相关内容推荐