Webpack 开发服务器仅在 docker 上热重载

Question

我有一段代码可以在 docker 或本地运行。 出于某种原因，热重载仅适用于 docker。

代码显然是相同的，并且内容由 webpack 开发服务器正确托管和提供。热重载没有端口错误，两种解决方案都使用相同的主机端口。

会是什么？

以下是区别：

主机：带有节点 v14.1.0 的 ubuntu

容器：节点：14.0.0-alpine3.10

用来运行的命令是：

webpack-dev-server --config webpack/webpack.dev.js --hot

和webpack相关的部分是

module.exports = {
  ...common,
  mode: "development",
  devServer: {
    historyApiFallback: true,
    host: "0.0.0.0",
    publicPath: "/",
    allowedHosts: ["0.0.0.0", "localhost", "*"],
    port: process.env.port || 3001
  },
  watch: true
};

包的版本是：

• "react-hot-loader": "^4.12.20",
• “webpack”：“^4.42.1”，
• "webpack-cli": "^3.3.11",
• “webpack-dev-server”：“^3.10.3”

我想不出为什么它只能在 docker 上运行，而不是在主机上运行，​​如果我期望相反的话。

Answer 1

错误堆栈将使我们能够轻松地帮助您。 也许您的 3001 端口正在被其他服务使用。

虽然不相关，但在这里 https://youtu.be/kIe7E02j2jY 您将找到有关从头开始为 React 配置 webpack 4 的详细信息。如果您是初学者，这是有用的资源。

Answer 2

热重载不起作用的原因是webpack-dev-server 在目录中查找文件更改的方式，它使用fsevent 和inotify。这些是 webpack 用来监视指定目录中文件的模块。您可以查看此answer for more info，如果您觉得它是正确的，请接受并投票。