Redux 热重载更改警告

Redux Hot Reload Warning on changes

当我尝试更新我的任何 React 组件时收到以下警告...

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.

据我所知,我的代码看起来像说明,但我仍然收到警告。

client.js

'use strict'

import React from 'react';
import { render } from 'react-dom';
import { Provider } from 'react-redux';
import { Router, browserHistory } from 'react-router';
import createStore from '../shared/store/createStore';

import routes from '../shared/routes';

const store = createStore(window.__app_data);
const history = browserHistory;

if (window.__isProduction === false) {
    window.React = React; // Enable debugger
}

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

render (
    <Provider store={store}>
        <Router history={history} routes={routes} />
    </Provider>,
    document.getElementById('content')
)

configureStore.js

'use strict';

import { createStore, applyMiddleware } from 'redux';
import thunk from 'redux-thunk';
import reducers from '../reducers';
import { selectSubreddit, fetchPosts } from '../actions'

export default function createReduxStore(initialState = {}) {
    const store = createStore(reducers, initialState, applyMiddleware(thunk));    

    if (module.hot) {
        // Enable Webpack hot module replacement for reducers
        module.hot.accept('../reducers', () => {
            const nextReducer = require('../reducers').default;
            store.replaceReducer(nextReducer);
        });
    }

    return store;
};

Server.js

import webpack from 'webpack';
import webpackDevMiddleware from 'webpack-dev-middleware';
import webpackHotMiddleware from 'webpack-hot-middleware';
import webpackConfig from '../../webpack.config.dev';

let compiler = webpack(webpackConfig);

app.use(webpackDevMiddleware(compiler, {
    hot: true,
    noInfo: true,
    publicPath: webpackConfig.output.publicPath
}));

app.use(webpackHotMiddleware(compiler));

有什么我想念的吗?如果您想查看完整的 src,这里有一个 link 到完整的 Github Repo

[已编辑] 添加了 server.js 和 github link。

找到答案了。需要进行多项更改。

  1. client.js 中删除 module.hot 代码(热重新加载该文件导致 Redux 和 React-Router 警告.
  2. 为我的 React 页面组件创建一个索引文件以从中导出。
  3. 将 module.hot 代码添加到新创建的索引文件中。
  4. 将所有 React 组件更改为 类。 const Page = () => () 不会通过热重载重新呈现。

进行这些更改后,一切开始正常工作,我不再收到警告:-)