我正在尝试在Redux计数器示例(移植到打字稿)上使用react-hot-loader v3设置HMR。
HMR实际上似乎有效,因为页面更新,但第一次更新总是抛出topic
奇怪的是,在我重新加载页面之前,后续更新不会抛出(并继续工作)。
我相信我已经按照所有文档的说法进行了设置,我无法弄清楚为什么会发生这种情况。我希望有人能碰到这个。
index.ts
warning.js?8f69:14 <Provider> does not support changing `store` on the fly. It is most likely that you see this error because you updated to Redux 2.x and React Redux 2.x which no longer hot reload reducers automatically. See https://github.com/reactjs/react-redux/releases/tag/v2.0.0 for the migration instructions.
root.ts
const store: Store<IAppState> = configureStore();
const rootEl = document.getElementById('root');
let render = () => {
ReactDOM.render(
<AppContainer>
<Root store={ store }/>
</AppContainer>,
rootEl
);
};
if (process.env.NODE_ENV !== 'production') {
if ((module as any).hot) {
(module as any).hot.accept(() => {
setTimeout(render);
});
}
}
render();
root.dev.ts
let Root = (process.env.NODE_ENV === 'production') ?
RootProd :
RootDev;
export default Root;
configureStore.ts
export default class RootDev extends React.Component<IRootProps, void> {
render() {
const { store } = this.props;
return (
<Provider store={store}>
<div>
<CounterApp />
<DevTools />
</div>
</Provider>
);
}
}
configureStore.dev.ts
let configureStore = (process.env.NODE_ENV === 'production') ?
configureStoreProd :
configureStoreDev;
export default configureStore;
如果粘贴的代码不足,整个项目就在这里:https://github.com/japhar81/redux_template