Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How do I fix " NullInjectorError: No provider for InjectionToken @ngrx/router-store Configuration!" after upgrading to ngrx v8 on my Angular project?

Tags:

angular

ngrx

I just upgraded a project from Angular 6 (and ngrx 6) to Angular 8. I tried to follow the migration guide for Angular 8, and was able to get everything to build, but ended up getting this error when I run it:

Full error message:

Unhandled Promise rejection: StaticInjectorError(AppModule)[StoreRouterConnectingModule -> InjectionToken @ngrx/router-store Configuration]: 
  StaticInjectorError(Platform: core)[StoreRouterConnectingModule -> InjectionToken @ngrx/router-store Configuration]: 
    NullInjectorError: No provider for InjectionToken @ngrx/router-store Configuration! ; Zone: <root> ; Task: Promise.then ; Value: NullInjectorError: StaticInjectorError(AppModule)[StoreRouterConnectingModule -> InjectionToken @ngrx/router-store Configuration]: 
  StaticInjectorError(Platform: core)[StoreRouterConnectingModule -> InjectionToken @ngrx/router-store Configuration]: 
    NullInjectorError: No provider for InjectionToken @ngrx/router-store Configuration!
    at NullInjector.push../node_modules/@angular/core/fesm5/core.js.NullInjector.get (http://localhost:4200/vendor.js:44694:25)
    at resolveToken (http://localhost:4200/vendor.js:44932:24)
    at tryResolveToken (http://localhost:4200/vendor.js:44876:16)
    at StaticInjector.push../node_modules/@angular/core/fesm5/core.js.StaticInjector.get (http://localhost:4200/vendor.js:44780:20)
    at resolveToken (http://localhost:4200/vendor.js:44932:24)
    at tryResolveToken (http://localhost:4200/vendor.js:44876:16)
    at StaticInjector.push../node_modules/@angular/core/fesm5/core.js.StaticInjector.get (http://localhost:4200/vendor.js:44780:20)
    at resolveNgModuleDep (http://localhost:4200/vendor.js:61915:29)
    at _createClass (http://localhost:4200/vendor.js:61968:32)
    at _createProviderInstance (http://localhost:4200/vendor.js:61932:26) NullInjectorError: StaticInjectorError(AppModule)[StoreRouterConnectingModule -> InjectionToken @ngrx/router-store Configuration]: 
  StaticInjectorError(Platform: core)[StoreRouterConnectingModule -> InjectionToken @ngrx/router-store Configuration]: 
    NullInjectorError: No provider for InjectionToken @ngrx/router-store Configuration!
    at NullInjector.push../node_modules/@angular/core/fesm5/core.js.NullInjector.get (http://localhost:4200/vendor.js:44694:25)
    at resolveToken (http://localhost:4200/vendor.js:44932:24)
    at tryResolveToken (http://localhost:4200/vendor.js:44876:16)
    at StaticInjector.push../node_modules/@angular/core/fesm5/core.js.StaticInjector.get (http://localhost:4200/vendor.js:44780:20)
    at resolveToken (http://localhost:4200/vendor.js:44932:24)
    at tryResolveToken (http://localhost:4200/vendor.js:44876:16)
    at StaticInjector.push../node_modules/@angular/core/fesm5/core.js.StaticInjector.get (http://localhost:4200/vendor.js:44780:20)
    at resolveNgModuleDep (http://localhost:4200/vendor.js:61915:29)
    at _createClass (http://localhost:4200/vendor.js:61968:32)
    at _createProviderInstance (http://localhost:4200/vendor.js:61932:26)
like image 650
Nathan Bedford Avatar asked Jun 12 '19 21:06

Nathan Bedford


1 Answers

After a bit of Googling (without finding the direct answer) I re-read the ngrx upgrade guide, and it had this nugget:

Usage of forRoot is now required for StoreRouterConnectingModule

BEFORE:

@NgModule({
  imports: [
    StoreRouterConnectingModule
  ]
})
export class AppModule {}

AFTER

@NgModule({
  imports: [
    StoreRouterConnectingModule.forRoot() // <-- gotta do this
  ]
})
export class AppModule {}

I fixed this in my AppModule, and that did the trick!

Note to self: next time read all the parts of the migration guide.

like image 145
Nathan Bedford Avatar answered Nov 17 '22 18:11

Nathan Bedford