Angular:Redux and Lazy loading [closed]

I am using the design pattern of Redux with Angular and I find it very useful, but how redux and lazy loading can leave toghether?

Please edit the question to limit it to a specific problem with enough detail to identify an adequate answer. Avoid asking multiple distinct questions at once. See the How to Ask page for help clarifying this question. If this question can be reworded to fit the rules in the help center, please edit the question.

1 Answer
1

Given that you don't state whether you are using or plan to use ngrx or angular-redux I will assume the more popular ngrx.

With ngrx you can load reducers and effects on initialisation. By default, the /src/app/reducers/index.ts will define your reducers with something like this:

export interface AppState
router: any,
simpro: BimState,
omnipresent: OmniState,
user: UserState


export const reducers: ActionReducerMap<AppState> =
router: routerReducer,
simpro: bimReducer,
omnipresent: omniReducer,
user: userReducer



The state and reducers defined here are always accessible.

However, if you have a portion of state that pertains only to a single lazily loaded route module, then you can add the state and the reducer to that specific module.

State and reducers loaded in this manner only take effect / appear in the Redux Devtools state tree when the route in question is activated and the module is loaded. So you must ensure they are not accessed in any code where they may not yet exist, e.g. in another lazily loaded module.

Similar logic applies to effects, they can be loaded in the root module or within a lazily loaded module.