使 Redux reducer 和其他非组件可热加载

Posted 2023-02-22

【中文标题】使 Redux reducer 和其他非组件可热加载

【英文标题】：Make Redux reducers and other non-components hot loadable

【发布时间】：2016-03-18 13:19:56

【问题描述】：

我很难让我的减速器可热插拔。

我正在使用 Webpack 和 react-transform-hmr。有了这个，当我保存时，所有的 CSS 和组件都是热加载的，但是当我尝试处理另一种类型时 - 最明显的是 reducer - 它会告诉我进行完全刷新。

我发现这是因为我需要明确地重新加载减速器并接受事件。我在store.js 中使用此代码：

if(module.hot) 
  module.hot.accept('./reducers/', () => 
    const nextRootReducer = require('./reducers/index');
    store.replaceReducer(nextRootReducer);
  );

reducers/index 导出根减速器。

但是现在当我运行它时，它仍然告诉我 [HMR] Cannot check for update (Full reload needed 并且还有错误说 [HMR] TypeError: currentReducer is not a function

所以 - 我需要一些帮助才能让它工作。该代码可在https://github.com/wesbos/Simple-Redux 获得，您可以通过以下方式重现它：

npm install npm start 在浏览器中打开 localhost:3000 编辑减速器 - 打开 posts.js 并将第 6 行的数字更改为其他任何值

【参考方案1】：

我没有仔细看，但我最好的猜测是它是this issue。 Babel 6 不再尝试让 ES6 默认导出 module.exports 的结果。

所以不是

const nextRootReducer = require('./reducers/index');

你可能想要

const nextRootReducer = require('./reducers/index').default;

与 ES6 默认导出的 Babel 6 输出相匹配。

【讨论】：

就是这样-谢谢！