reactjs - Webpack/React 热重载重新加载整个页面？

Question

这可能一直被问到，但我已经尝试了所有方法，但找不到解决方案。

I've created a repo to make it easier to get help 。您可以克隆它，运行 npm install ，然后运行 ​​npm start:dev 来查看 http://localhost:8080 上的快速本地服务器.

它有效，当我更改文件(例如，src/components/Note/Note.css)时，应用程序会重新加载。但是，我只想重新加载组件，而不是整个页面。我不确定我做错了什么。任何帮助将不胜感激!

Answer 1

要调试此类问题，请在 Chrome DevTools 控制台设置中启用“保留日志”，以便在页面刷新时保留控制台日志。

错误是:

Uncaught RangeError: Maximum call stack size exceeded

进行以下更改后，此问题已得到修复:

1. 从插件中删除 new webpack.HotModuleReplacementPlugin()(因为 webpack-dev-server 是通过 --hot 启动的)

2. 还可以通过将 .babelrc 中的 presets 更新为 ["react", ["env", { 来选择退出 babel 转译 ES6 模块“模块”:假}]]。

"modules": false 是告诉 babel 不要编译 import/exports 并让 webpack 按描述处理它 here和here (检查步骤 3.3.c)。