I am trying to add the library redux-injectors from react-boilerplate in my project. However, I get the issue in the image below. My file configureStore is presented below, you can also find it in this repository: https://github.com/guifeliper/example-redux-injectors
What I can do to have the redux-injectors working, I always get this error when I try to apply the library, it seems that my middleware is not in the correct format. Do you have any clue about it?
function createReducer(injectedReducers = {}) {
const rootReducer = combineReducers({
...injectedReducers,
// other non-injected reducers can go here...
});
return rootReducer
}
export default function testingConfigureStore(preloadedState = {}) {
const sagaMiddleware = createSagaMiddleware();
const runSaga = sagaMiddleware.run;
const injectorMiddleware = createInjectorsEnhancer({
createReducer,
runSaga,
});
const middlewares = [injectorMiddleware]; // loggerMiddleware
const middlewareEnhancer = composeWithDevTools(
applyMiddleware(...middlewares)
);
const enhancers = [middlewareEnhancer];
const composedEnhancers = compose(...enhancers);
const store = createStore(createReducer(), preloadedState, composedEnhancers);
return store;
}
The final solution was the following:
const staticReducers = {
default: defaultReducer,
}
function createReducer(asyncReducers) {
return combineReducers({
...staticReducers,
...asyncReducers
})
}
export default () => {
let composeEnhancers = compose;
const sagaMiddleware = createSagaMiddleware();
const runSaga = sagaMiddleware.run;
// If Redux Dev Tools and Saga Dev Tools Extensions are installed, enable them
/* istanbul ignore next */
if (process.env.NODE_ENV !== 'production' && typeof window === 'object') {
/* eslint-disable no-underscore-dangle */
if (window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__)
composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__({});
}
const injectEnhancer = createInjectorsEnhancer({
createReducer,
runSaga,
})
const store = createStore(
createReducer(),
composeEnhancers(
applyMiddleware(sagaMiddleware),
injectEnhancer
)
);
store.asyncReducers = {};
return store;
};
Check the CreateStore, where I added the applyMiddleware and InjectEnhancer together. I decided to add a full version in the github as I didn't find any online. https://github.com/guifeliper/example-redux-injectors