32

我使用 create-react-app 样板创建了一个反应应用程序，这似乎很受欢迎，热重载有时会在任何文件更改时更新，有时不会，似乎有最短持续时间或类似的东西，我m 使用 Ubuntu，节点版本 7.0，package.json 中的脚本是npm:'react-script start'我所缺少的吗？

4

10 回答 10

53

create-react-app当 npm start 未检测到更改时，以下是文档链接中提供的常见故障排除步骤。

当应用程序npm start在编辑器中运行和更新代码时，应该可能用更新的代码刷新浏览器。如果这没有发生，请尝试以下解决方法之一：

  1. 如果项目文件直接从 Dropbox 或 Google Drive 等云存储同步到您的本地系统，并且您尝试直接在其中运行应用程序，请尝试将其移出。
  2. 由于 Webpack 错误，您可能需要重新启动 watcher。如果观察者没有检测到 index.js 并且您通过文件夹名称引用它。
  3. Vim 和 IntelliJ 等编辑器中的安全写入功能目前破坏了观察者。您将需要禁用它。
  4. 由于Webpack watcher bug，路径包含括号的项目会导致问题，请尝试将项目移动到没有它们的路径。.
  5. 要在 Linux 和 macOS 中允许更多观察者，您可能需要调整系统设置。
  6. 如果项目在虚拟机中运行，例如（Vagrant 配置的）VirtualBox，.env如果项目目录不存在，则在项目目录中创建一个文件，然后添加CHOKIDAR_USEPOLLING=true到其中。这可以确保下次运行npm start时，观察者会根据需要在 VM 内使用轮询模式。
  7. 可以尝试增加max_users_watches-链接

更多参考：

于 2017-05-29T04:31:18.457 回答
11

试试这些：

  • 在 IDE 中关闭安全写入
  • 增加max_user_watches
  • 你的路径不应该有括号

作为最后的手段，尝试使用它作为你的环境变量： CHOKIDAR_USEPOLLING=true npm start

资料来源： https ://github.com/facebookincubator/create-react-app/issues/659 https://github.com/facebookincubator/create-react-app/issues/1049#issuecomment-261731734

于 2017-05-26T13:55:13.693 回答
6

我能够使用以下方法完成这项工作：

sudo npm start
于 2019-03-14T09:53:06.703 回答
5

运行这个命令

sudo -i
echo 1048576 > /proc/sys/fs/inotify/max_user_watches
exit
于 2019-09-12T23:30:07.187 回答
0

在unbuntu中，我基本上杀死了端口上运行的所有进程（对于反应应用程序默认值为：3000）。

列出在端口 3000 上运行的所有进程。

lsof -i :3000

该命令将显示类似这样的内容。

COMMAND   PID USER   FD   TYPE  DEVICE SIZE/OFF NODE NAME
node     7429 yipl   19u  IPv4 1081760      0t0  TCP localhost:3000->localhost:35762 (ESTABLISHED)
chrome  26448 yipl  177u  IPv4 1080082      0t0  TCP localhost:35762->localhost:3000 (ESTABLISHED)

现在通过 PID 杀死进程。

kill -9 7429
kill -9 26488

再次启动您的反应应用程序。

于 2018-06-28T03:09:37.603 回答
0

显然，如果您退出应用程序，热模块重新加载仅适用于开箱即用。

但是，如果您还没有弹出您的应用程序，那么您可以按照这些说明使其工作。

ReactDOM.render(...)在您的应用顶部找到，并在其下方添加以下行：

ReactDOM.render(...);

if (module.hot) {
  module.hot.accept('./App', () => {
    // --- Copy-paste your usual ReactDOM.render(...) call here: --- //
    ReactDOM.render(...);
  });
}

上面链接的说明还显示了如何热重载组件树之外的东西，例如 redux reducer。

于 2018-10-26T09:15:17.650 回答
0

我刚刚遇到的另一种情况是，将多个版本的 nodejs 与 NVM 并行使用。基本上，我有两个终端窗口，一个运行节点 10.x，另一个在节点 9.x 上，Webpack 观察者停止看到变化。

解决方案是将两者带到相同的节点版本

于 2019-03-07T02:28:45.640 回答
0

尝试删除 node_modules 文件夹并使用 cmd 重新安装npm install

为我工作（ubuntu 18.04.3 LTS）

于 2019-08-21T00:10:44.777 回答
0

sudo npm start

我不太了解linux，但这可能是由于防火墙设置，因为我在windows中做了同样的事情，并且在那里启动反应开发服务器我们需要通过防火墙进行访问，所以在这里我们需要做同样的事情它是管理员权限（在 ubuntu linux 发行版的情况下为 sudo）。

于 2020-12-21T13:25:25.547 回答
0

如果您以一堆错误启动您的应用程序，它似乎会停止查看您的文件，因此不会检测到您对损坏文件的修复。似乎您需要在没有太多/严重错误的情况下启动“启动”，文件观察程序才能工作。

于 2021-01-31T22:09:06.063 回答