question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Dynamic injection reducer via Hook is not working

See original GitHub issue

I’m using react boilerplate

In react-boilerplate/app/configureStore.js I added

import { AsyncStorage } from "react-native";
import {
  persistReducer,
  persistStore,
} from "redux-persist";
import createReducer from "./reducers";
...
...
const persistConfig = {
    key: "v1",
    storage: AsyncStorage
};
const persistedReducer = persistReducer(persistConfig, createReducer());
...
...
const store = createStore(
    persistedReducer,
    initialState,
    composeEnhancers(...enhancers)
);

const persistor = persistStore(store);
store.persistor = persistor;
...
...
return { store, persistor };

in react-boilerplate/app/app.js

import { PersistGate } from "redux-persist/integration/react";

// Create redux store with history
const initialState = {};
const { persistor, store } = configureStore(initialState, history);
...
...
<Provider store={store}>
     <PersistGate loading={null} persistor={persistor}>
          <AppEntry />
     </PersistGate>
</Provider>

in react-boilerplate/app/utils/reducerInjectors.js added

store.replaceReducer(createReducer(store.injectedReducers));
store.persistor.persist();

in app/containers/HomePage/index.js already added by react boilerplate

import { useInjectReducer } from 'utils/injectReducer';
import reducer from './reducer';
...
...
const key = 'home';
useInjectReducer({ key, reducer });

the error I got in console

Unexpected key “contactPage” found in previous state received by the reducer. Expected to find one of the known reducer keys instead: “global”, “language”, “loginPage”, “drawer”, “router”. Unexpected keys will be ignored.

This error shows because _persist is no more exists in redux state

When we change any thing to redux state , after refreshing the page, every thing will be gone. Without injecting , every things work fine

I spent many hours to fix this and I wasn’t able. Any help will be appreciate it

Issue Analytics

  • State:open
  • Created 4 years ago
  • Comments:6

github_iconTop GitHub Comments

5reactions
ilyausorovcommented, Aug 1, 2019

A quicker (albeit more manual) approach is to just state each reducer in your root reducer, rather than relying on the injectedReducer paradigm. Works well if you don’t have too many reducers in play.

0reactions
kerituni12commented, Apr 22, 2022

is there any update?

Read more comments on GitHub >

github_iconTop Results From Across the Web

Dynamic injection reducer via Hook is not working
I'm using react boilerplate. In react-boilerplate/app/configureStore.js I added import { AsyncStorage } from "react-native"; ...
Read more >
Code Splitting | Redux
To code split with Redux, we want to be able to dynamically add reducers to the store. However, Redux really only has a...
Read more >
The Ultimate Cheat Sheet on Splitting Dynamic Redux Reducers
While exploring the possibility to optimise the application, the common problem occurs with reducers. This article specifically focuses on how do we split ......
Read more >
How to dynamically load reducers for code splitting in a Redux ...
The ability to add reducers dynamically is a must when dealing with code splitting and large applications. I have entire sub trees that...
Read more >
Why can't redux and hooks be implemented via dependency ...
The most common problems that Guice-style dependency injection exists to solve just aren't as relevant in modern Javascript as they are in Java....
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found