How to silence "The feature name "router" does not exist in the state..." ngrx/router-store warning

Question

When I add "@ngrx/router-store" to my project, it spams the app console in development mode and unit test results with the following message:

The feature name "router" does not exist in the state, therefore createFeatureSelector cannot access it. Be sure it is imported in a loaded module using StoreModule.forRoot('router', ...) or StoreModule.forFeature('router', ...). If the default state is intended to be undefined, as is the case with router state, this development-only warning message can be ignored.

I tried to set router state property type to

router: null |  RouterReducerState<SerializedRouterStateSnapshot>

and initial state value to

router: null

but it clashes with routerReducer type, which only accepts

RouterReducerState<SerializedRouterStateSnapshot>

How do I disable this warning? I honestly find it rather annoying.

Answer 1

Do you have a default return in your switch statement?

 default:
   return state;

Answer 2

Here's what helped me: do not use createFeatureSelector to create router feature selector, use createSelector instead.

export const routerState = createSelector((state: State) => state.router, value => value)

The issue happens because createFeatureSelector logs a warning if feature value equals to undefined. The code above is equivalent to original implementation, but without a log.

Update: here's a PR that aims to solve the issue.

Answer 3

try to select the router slice of state with a simple function

export const selectRouter = (state: State) => state.router;

because createFeatureSelector, hence the name, is used for selecting a slice of state added in a FEATURE module

StoreModule.forFeature('feature1', reducers)

in this case you should use createFeatureSelector

export const selectFeature1 = createFeatureSelector<State, Feature1State>('feature1');