问题:在 docker 容器外编辑文件时 React Webpack 不重建(在 Mac 上)

我使用 create-react-app 在 docker 容器中创建了一个 react 应用程序。当我在容器内编辑 App.js 时,应用程序会自动重建并且浏览器会重新加载。但是,当我在容器(在主机上)outside 编辑文件时,它不会被重建。

这是一个 webpack/watch 问题吗?但也可能与在 mac 上运行 docker 有关?任何帮助,将不胜感激。

我认为这种事情对于开发人员设置来说是很正常的(即 - 使用 docker 创建您的构建环境,但对实际代码使用挂载)。

这里是我正在使用的 Github 存储库。

解答

我自己想通了。是 webpack 配置阻止了从容器外部进行编辑以触发重建和重新启动。诀窍是(显然这是一个遗留选项)

watchOptions {
  poll: 100
}

注意:使用 poll:1000 只会刷新每隔一个编辑。每次编辑使用 100 个作品。不知道为什么。

所以对于我的后端 API,我正在运行 node/expressjs。这里我需要安装并运行 webpack 和 nodemon。 (nodemon 在容器外编辑时需要 -L 选项才能工作)。

我的前端是使用 create-react-app 创建的,其中没有暴露任何 webpack 配置。我不得不跑

npm run eject

公开 webpack 配置(我编辑了 config/webpackDevServer.config.js 文件)。

现在,不赞成使用弹出,因为“你不能回去”......但由于我使用的是 docker 容器并在构建容器时使用 create-react-app/eject - 我已经有效地从这个中拯救了自己不良情况。 (尽管如果我有任何变化,我可能必须修复我的 docker 文件)。

所有这些编辑都可以在我的 docker 文件中找到https://github.com/roocell/fullstack_react_nodejs_in_docker