I am trying to implement code splitting in my redux code of react application using the injectReducer approach. It works well with only client side rendering but fails with server side rendering when I try to dump the server sent store into redux as it happens at root level of my client code before I reach the page level component that calls the inject reducer.
For instance 'pageASate' is added dynamically into redux using inject reducer. On server I add it dynamically and render the page. Once the page renders on client and the store dump { 'pageAState': '...some data'} is recein=ved from server, I try to initialise redux with same at root level.
const store = configureStore(window.SERVER_STATE)
Since the server state has the 'pageAState' which is not part of reducers list sent to redux, it throws below error:
Unexpected key "pageASate" found in preloadedState argument passed to createStore. Unexpected keys will be ignored.
Hence the store is getting initialised without state of pageA sent by server causing he page to get blank and re-render again once data is fetched again on client. How can it be handled?