dynamic redux app loading vs store composition and combineReducers

Question

Let's say I've got a very big application written in react/redux and I've got application split into modules, webpack import statements, etc.

I need to provide a setup that for a given production build, I choose which modules should get included into the dist (rest is ignored). For example, I've got modules A, B, C, D. One customer paid for modules A & B and that's what he gets, another one paid for all and gets A, B, C, D. And this is what should get bundled, there is, of course, one consistent codebase.

On webpack level I'm just generating a new entry point that will include (AST-level) modules that I want (import moduleA, import moduleB)... but now comes the question about redux store and combineReducers.

Is there any way to dynamically add pieces into a combineReducers call? The only way I can think of is to generate the root reducer manually, importing module reducers. But maybe there is any better approach to do that?

Answer 1

The standard approach to dynamically adding slice reducers is to call combineReducers again, pass in all the reducers you want to have now, and call store.replaceReducer(newRootReducer).

The react-boilerplate project has an example of this. See their utility function injectAsyncReducer.