Redux / React HMR <provider>错误

时间:2016-11-26 15:49:43

标签: reactjs redux react-redux typescript2.0 hot-module-replacement

我正在尝试在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

0 个答案:

没有答案