Angular4 How to load a module in an eager way

Question

In Angular4, you can lazy load your module using the loadChildren attribute in your routing config with pathToMyModule#MyModule. I was wondering if there was any attribute I could specify to always load my module (so basically disabling the lazy loading).

Answer 1

import all the modules in the module that you bootstrap when you start the application. In general it is called AppModule. It is the default way though. Then don't use loadChrildren. The modules should import each other hierarchically, then all modules will be imported eagerly.

@NgModule({
    imports: [
       AppRoutingModule,
       LoginModule,
       //here you should import all other modules, or other the modules should import each other hierarchically
    ],
    declarations: [
       AppComponent      
    ],
    bootstrap: [AppComponent] 
})

export class AppModule { 

}

@NgModule({
    imports: [
        RouterModule.forRoot([
         {path: '', component: SomeComponent}     
   ],
   exports: [
        RouterModule
    ]
})
export class AppRoutingModule {
}




@NgModule({
    imports: [
        LoginRoutingModule
    ]
})
export class LoginModule {
}


@NgModule({
  imports: [
    RouterModule.forChild([
      {
        path: 'login',
        children: [
          {path: '', pathMatch: 'full', redirectTo: 'somepath'},
          {path: 'somepath', component: SomeOtherComponent}, 
        ]
      }

    ])
  ],
  exports: [
    RouterModule
  ]
})
export class LoginRoutingModule {
}