RouterModule.forRoot called twice

I got this error because I somehow accidentally imported the root AppModule into my lazy-loaded module. This caused the root AppRoutingModule to be called again when the lazy-loaded module was loaded, and thus RouterModule.forRoot was called twice.

If you are certain you aren't calling RouterModule.forRoot twice then this could be the cause of the issue. Check that you aren't importing any modules in your lazy-loaded module that direcly call RouterModule.forRoot or import a module that calls RouterModule.forRoot.

I've been struggling with this for a while. Finally found the issue.

I'm using lazy loading. And even though I'd only used .forRoot in one place in the app, the error suggested that I was using it twice.

Turned out that I was importing the AppRoutingModule from app.routing.ts file in one of the feature modules that was being lazy loaded. And I had done this earlier because it kept saying it didn't recognize routerLink which I had used in one of the components in that feature module.

The solution was to replace the AppRoutingModule import in the feature module with an import of the RouterModule from '@angular/router'. Now everything works.

PS - when I say feature module, I mean sub module that I'm lazy loading.

I have faced the problem too, and for the future comers, This is my solution.

Do not import AppRoutingModule in oer module, Import RoutingModule

It will be solved. Here is an example.

import { RouterModule } from '@angular/router';

And in the imports array

  @NgModule({ declaration: [], // your contents imports: [  RouterModule,  // Other modules ]  })