Redux Hot Reload Warning on changes

Question

I get the following warning when I try to update any of my react components...

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.

As far as I can tell, my code looks like the instructions, but I still get the warning.

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));

Is there something I'm missing? Here is a link to the full Github Repo if you want to see the full src.

[Edited] Added server.js and github link.

Answer 1

Found the answer. There were multiple changes needed.

1. Remove module.hot code from client.js (Hot reloading that file caused Redux and React-Router warnings.
2. Create an index file for my React page components to export from.
3. Add module.hot code to newly created index file.
4. Change all React components to classes. const Page = () => () doesn't re-render with hot reloading.

After making those changes, everything started to work properly and I get no more warnings :-)