Question

我刚开始使用create-react-app在React中编码。在文档中，它说

如果您进行了修改，页面将重新加载。

我不知道哪个模块负责自动重新加载（webpack或react-hot-reloader？）但它不起作用。我使用不同的编辑器（Sublime，VIM，..）编辑了文件，但似乎问题出在其他方面。有关如何调试的建议吗？

Answer 1

经过太多搜索后，我发现Webpack watch使用inotify来观察文件的变化，而在ubuntu 14.04中它被设置为一个较低的值。快速修复：

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

Answer 2

我在 react ^17.0.2 中遇到了这个问题，我通过添加 .env 文件并设置 FAST_REFRESH=false 解决了这个问题。只需在项目的根目录中创建一个 .env 文件并在该文件中添加 FAST_REFRESH=false。

Answer 3

对于Ubuntu用户，请在终端上运行它：

sudo gedit /etc/sysctl.conf

滚动到底部并粘贴：

fs.inotify.max_user_watches=524288

保存并克隆编辑器，然后运行以下命令：

sudo sysctl -p

要检查您的成功：

cat /proc/sys/fs/inotify/max_user_watches

这应该返回524288

由 apsrcreatix

参考：https://github.com/flathub/com.visualstudio.code/issues/29#issuecomment-477126012

Answer 4

由于更新了一些包（可能是因为 typescript），我在 Create React 应用程序中的热重载中断了。我不得不在不弹出 CRA 的情况下解决它。

我设法通过升级到这些软件包的 16.10 版来修复它：

"react": "^16.10.0",
"react-dom": "^16.10.0"

而且效果很好！

我在 index.tsx 中的代码：

...
const isDev = process.env.NODE_ENV === 'development'
const rootEl = document.getElementById('root')

ReactDOM.render(<App />, rootEl)

if (isDev && module.hot) {
  module.hot.accept('screens/App', () => {
    ReactDOM.render(<App />, rootEl)
  })
}

提示： 先试试这个代码（可能你设置的路径不对）

if (module.hot) {
  module.hot.accept()
}

如果这开始工作，那么你想指定路径以使热加载更有效（更少的冒泡=更短的加载）

Answer 5

尝试在 .env 文件中添加 CHOKIDAR_USEPOLLING=true。

Answer 6

在 create-react-app 之后，我更改了我的项目名称。这是导致 reload 不起作用的原因之一。然后我再次 create-react-app，reload 现在正在工作。

创建反应应用程序，重新加载不起作用

6 个答案: