create-react-app 的开发服务器不自动刷新

2022-01-31 00:00:00 reactjs javascript create-react-app

我正在关注关于使用 create-react-app 的 React 的教程.该应用程序由 create-react-app v1.3.0

I am following a tutorial on React using create-react-app. The application is created by create-react-app v1.3.0

create-react-app my-app

开发服务器由

npm start

多次更改代码后，浏览器不会实时更新/热重新加载更改.刷新浏览器没有帮助.只有停止开发服务器并重新启动它才能捕获对代码的新更改.

After changing the code several times, the browser is not updated live / hot reload with the changes. Refreshing the browser does not help. Only stopping the dev server and starting it over again capture the new changes to the code.

推荐答案

您看过用户指南的疑难解答"部分吗?
它描述了 这个问题的几个常见原因:

Have you seen the "Troubleshooting" section of the User Guide?
It describes a few common causes of this problem:

当您在 npm start 运行时保存文件时，浏览器应使用更新后的代码进行刷新.

When you save a file while npm start is running, the browser should refresh with the updated code.

如果没有发生这种情况，请尝试以下解决方法之一:

If this doesn’t happen, try one of the following workarounds:

  • 如果您的项目位于 Dropbox 文件夹中，请尝试将其移出.
  • 如果观察者没有看到名为 index.js 的文件，而您通过文件夹名称引用它，则您 由于 Webpack 错误需要重启观察者.
  • 一些编辑器，如 Vim 和 IntelliJ，有一个安全写入"功能，目前会破坏观察者.您将需要禁用它.按照禁用在vim中创建交换文件"中的说明操作.
  • 如果您的项目路径包含括号，请尝试将项目移至没有括号的路径.这是由 Webpack 观察程序错误引起的.
  • 在 Linux 和 macOS 上，您可能需要调整系统设置 允许更多的观察者.
  • 如果项目在虚拟机中运行，例如(由 Vagrant 配置的)VirtualBox，则在项目目录中创建一个 .env 文件(如果该文件不存在)，然后添加 CHOKIDAR_USEPOLLING=对它来说是真的.这可确保下次您运行 npm start 时，观察者会根据虚拟机内部的需要使用轮询模式.
  • If your project is in a Dropbox folder, try moving it out.
  • If the watcher doesn’t see a file called index.js and you’re referencing it by the folder name, you need to restart the watcher due to a Webpack bug.
  • Some editors like Vim and IntelliJ have a "safe write" feature that currently breaks the watcher. You will need to disable it. Follow the instructions in "Disabling swap files creation in vim".
  • If your project path contains parentheses, try moving the project to a path without them. This is caused by a Webpack watcher bug.
  • On Linux and macOS, you might need to tweak system settings to allow more watchers.
  • If the project runs inside a virtual machine such as (a Vagrant provisioned) VirtualBox, create an .env file in your project directory if it doesn’t exist, and add CHOKIDAR_USEPOLLING=true to it. This ensures that the next time you run npm start, the watcher uses the polling mode, as necessary inside a VM.

如果这些解决方案都没有帮助，请在此线程中留下评论 .

If none of these solutions help please leave a comment in this thread.

我希望这会有所帮助！

相关文章