reactjs - 在 Windows 上使用 Docker 创建 react 应用程序 livereload

标签 reactjs docker create-react-app

我正在尝试在 Windows 10(Linux 容器模式)上运行 docker 来运行 React 开发工作区。我设法运行 React 应用程序样板,但实时重新加载不起作用。

以下是一些详细信息:

  1. Dockerfile 暴露了 5000 和 35729 端口
  2. 通过 docker execcreate-react-app . 命令在容器内挂载和创建文件
  3. WS 请求状态为 101(正确)

Dockerfile:

FROM node:latest

#installing react app first
RUN npm install -g create-react-app

VOLUME [ "/application" ]

#First example was EXPOSE 3000 35729
EXPOSE 3000
EXPOSE 35729
  1. 构建命令: docker build 。 -t react 图像

  2. 运行命令: docker run -d -p 3000:3000 -p 35729:35729 -v %PATH_TO_APP_FOLDER%\application:/application --name React-container React -图像

  3. 执行命令: docker exec -it react-container bash

然后在容器内:

  • CD 应用程序
  • 创建react-app。
  • yarn 开始

输出:

Compiled successfully!

You can now view application in the browser.

Local: http://localhost:3000/ On Your Network: http://172.17.0.2:3000/

Note that the development build is not optimized. To create a production build, use yarn build.

打开后:http://localhost:3000一切似乎都工作正常。如果我从主机更改文件,容器内的文件也会更改(使用 cat App.js 检查)。但更改文件不会触发 webpack 重新编译和 livereload。

有什么建议吗?

如果我需要提供更多详细信息,请告诉我。谢谢

最佳答案

这可以通过在 webpack 配置中将 watchOptions.poll 设置为 true 来解决: References

关于reactjs - 在 Windows 上使用 Docker 创建 react 应用程序 livereload,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47980383/

相关文章:

reactjs - 路由器无法与 Link 一起使用(React Router Dom 6)

html - 如何在 create-react-app 中为 index.html 指定 Cache-Control header

javascript - React - 表单提交后清除输入值

reactjs - simpleWebRTC RemoteMedia 视频不包含正确的 screenCapture bool

reactjs - React.js 中 useEffect 的奇怪行为

mysql - 如何连接到本地机器上容器中运行的 MySQL 实例?

docker - 图像搜索 Docker 私有(private)注册表 2

reactjs - 从 vscode 调试启动时,如何让 Firefox 正确恢复其状态?

python - 如果我的 docker 镜像有 2.5GB,我会遇到什么问题以及如何减小大小?

reactjs - React 错误边界并不能阻止 cra 应用程序崩溃