React-Native: <Provider> does not support changing store on the fly

[winterbe]

Hi there,

I'm using Redux (v3.4.0) with react-redux (v4.4.2) from a React Native (v0.23.1) app. I've set up RNs built-in hot reloading for the redux store as described here.

However when editing the file where I use <Provider> the following error is thrown:

ExceptionsManager.js:76 <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.

Here's the relevant code:

app.js

const store = configureStore();

export default React.createClass({
    render() {
        return (
            <Provider store={store}>
                <Text style={styles.hello}>Hi there</Text>
            </Provider>
        );
    }
});

configureStore.js

import {createStore, applyMiddleware} from 'redux';
import thunk from 'redux-thunk';
import createLogger from 'redux-logger';
import reducer from './reducers';

export default initialState => {
    const logger = createLogger({collapsed: true});

    const store = createStore(
        reducer,
        initialState,
        applyMiddleware(thunk, logger)
    );

    if (module.hot) {
        module.hot.accept(() => {
            const nextRootReducer = require('./reducers').default;
            store.replaceReducer(nextRootReducer);
        });
    }

    return store;
};

I've checked for duplicate react versions via npm ls react, but results in single dep: [email protected]

Anyone can point me into the write direction, what's going wrong in my code?

Thanks in advance.

[gaearon]

If you change the component that creates the store, store = createStore() will re-execute and you will get a new store. Either don’t change that component while you work on the app (do you often need to change the root component?), or create store in index.js and pass it as a prop so you can work on the component independently.

[winterbe]

Thanks for your input. The App component barely changes so it's not that big of an issue. I wasn't entirely sure if I've set up all correctly but the crucial part of hot reloading (changing reducer code) seems to work well, so I guess I'm good to go. 👯

[thorbenandresen]

@gaearon Does this mean that I just have to accept that I won't be able to hot-reload when working on my flow-control logic (thunks, sagas)?