React 创建应用程序热重载并不总是在 linux

Question

我使用 create-react-app 样板创建了一个 React 应用程序，它似乎非常流行，热重载有时会在任何文件更改时更新，有时则不会，似乎有最短持续时间或其他内容像那样，我正在使用 Ubuntu，节点版本 7.0，package.json 中的脚本是 npm:'react-script start' 我缺少的东西？

Answer 1

试试这些：

关闭 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

Answer 2

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

虽然应用程序是运行 npm start 并且在编辑器中更新代码应该可以使用更新的代码刷新浏览器。如果没有发生这种情况，请尝试以下解决方法之一：

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

更多参考资料：

Answer 3

在 unbuntu 中，我基本上杀死了端口上的所有进程运行（对于 React 应用程序默认值为：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

重新启动你的 React 应用程序。

Answer 4

显然热模块重新加载仅在您弹出您的应用程序时开箱即用。

但是如果你还没有弹出你的应用程序，那么你可以按照these instructions让它工作。

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

ReactDOM.render(...);

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

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

Answer 5

我刚刚遇到的另一个案例是并行使用多个版本的 nodejs 和 NVM。基本上，我有两个终端 windows，一个运行节点 10.x，另一个在节点 9.x 上，Webpack watcher 不再看到变化。

解决方案是将两者带到同一个节点版本

Answer 6

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

sudo npm start

Answer 7

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

对我有用（ubuntu 18.04.3 LTS）

Answer 8

运行这个命令

sudo -i
echo 1048576 > /proc/sys/fs/inotify/max_user_watches
exit

Answer 9

sudo npm start

我对 linux 了解不多，但这可能是由于防火墙设置所致，因为我在 windows 中做了同样的事情，为了启动 React 开发服务器，我们需要授予访问权限通过防火墙，所以要在这里做同样的事情，我们需要给它管理员权限（sudo 在 ubuntu linux 分布的情况下）。

Answer 10

如果您启动应用程序时出现一堆错误，它似乎会停止监视您的文件，因此不会检测到您对损坏文件的修复。似乎您需要启动“启动”，但不会出现太多 many/severe 错误，文件观察程序才能工作。

React 创建应用程序热重载并不总是在 linux

React create app hot reload is not always working on linux

linux

node.js

reactjs

create-react-app