在docker容器内使用create-react-app运行开发服务器

时间:2017-06-20 02:54:23

标签: docker create-react-app

我正在尝试在docker容器中运行create-react-app的开发服务器并让它重新编译并将更改后的应用程序代码发送到客户端以进行开发,但它没有从内部获取更改码头工人集装箱。

(当然,我将应用程序的工作目录作为容器的卷。)

有没有办法让这项工作成功?

4 个答案:

答案 0 :(得分:8)

另一个答案中建议的轮询将导致更高的CPU使用率并迅速耗尽电池电量。您不需要CHOKIDAR_USEPOLLING=true,因为文件系统事件应传播到容器。从最近开始,即使您的主机运行Windows,这也应该起作用:https://docs.docker.com/docker-for-windows/release-notes/#docker-desktop-community-2200(搜索“ inotify”)。

但是,当使用Mac的Docker时,该机制有时会失败:https://github.com/docker/for-mac/issues/2417#issuecomment-462432314

重新启动Docker守护程序对我来说很有帮助。

答案 1 :(得分:6)

实际上,我找到了答案here。显然,create-react-app使用chokidar来监视文件更改,它有一个标志CHOKIDAR_USEPOLLING来使用轮询来监视文件更改。所以CHOKIDAR_USEPOLLING=true npm start应该解决问题。至于我,我在我的环境变量中为docker容器设置了CHOKIDAR_USEPOLLING=true,并且刚刚启动了容器。

答案 2 :(得分:0)

如果您的更改没有被接受,则可能是文件监视机制存在问题。此问题的解决方法是配置轮询。您可以按照 @Javascriptonian 的说明在全局范围内执行此操作,但您也可以通过 webpack 配置在本地执行此操作。这样做的好处是可以指定被忽略的文件夹(例如 node_modules),这会在使用轮询时减慢观看过程(并导致 CPU 使用率过高)。

在您的 webpack 配置中,添加以下配置:

devServer: {
  watchOptions: {
    poll: true, // or use an integer for a check every x milliseconds, e.g. poll: 1000
    ignored: /node_modules/ // otherwise it takes a lot of time to refresh
  }
}

来源:documentation webpack watchOptions


如果您在后端 Node.js 项目中遇到与 nodemon 相同的问题,您可以使用 --legacy-watch 标志(短 -L)也开始轮询。< /p>

npm exec nodemon -- --legacy-watch --watch src src/main.js

或在 package.json 中:

"scripts": {
  "serve": "nodemon --legacy-watch --watch src src/main.js"
}

文档:nodemon legacy watch

答案 3 :(得分:0)

如果你使用 linux 那么你不需要使用 CHOKIDAR_USEPOLLING=true