ERROR Error: Uncaught (in promise): Error: Cannot find module './user/user.module'

Question

I am trying lazy loading of the module and getting below error

ERROR Error: Uncaught (in promise): Error: Cannot find module './user/user.module'

UserModule

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { RouterModule } from '@angular/router';
import { userRoutes } from './user.routes';
import { ProfileComponent } from './profile.component';

@NgModule({
  imports: [CommonModule, RouterModule.forChild(userRoutes)],
  declarations: [ProfileComponent],
  providers: []
})
export class UserModule {}

Added path to my path in userRoutes
{ path: 'user', loadChildren: './user/user.module#UserModule' }

Full Error Stack

core.js:6241 ERROR Error: Uncaught (in promise): Error: Cannot find module './user/user.module'
Error: Cannot find module './user/user.module'
    at $_lazy_route_resource lazy namespace object:5
    at ZoneDelegate.invoke (zone-evergreen.js:364)
    at Object.onInvoke (core.js:41667)
    at ZoneDelegate.invoke (zone-evergreen.js:363)
    at Zone.run (zone-evergreen.js:123)
    at zone-evergreen.js:857
    at ZoneDelegate.invokeTask (zone-evergreen.js:399)
    at Object.onInvokeTask (core.js:41645)
    at ZoneDelegate.invokeTask (zone-evergreen.js:398)
    at Zone.runTask (zone-evergreen.js:167)
    at resolvePromise (zone-evergreen.js:798)
    at resolvePromise (zone-evergreen.js:750)
    at zone-evergreen.js:860
    at ZoneDelegate.invokeTask (zone-evergreen.js:399)
    at Object.onInvokeTask (core.js:41645)
    at ZoneDelegate.invokeTask (zone-evergreen.js:398)
    at Zone.runTask (zone-evergreen.js:167)
    at drainMicroTaskQueue (zone-evergreen.js:569)
    at ZoneTask.invokeTask [as invoke] (zone-evergreen.js:484)
    at invokeTask (zone-evergreen.js:1621)

Answer 1

The new way to load modules is by using arrow functions

Add the below path to app routing ts

{ path: 'user', loadChildren: ()=> import('./user/user.module').then(m => m.UserModule)}:

And then in your lazy loaded module user routing one add like this

const routes: Routes = [
  {
    path: '',
    component: UsersComponent
  }
];

If your creating the angular app in the latest version then use the above way to do it.