EXCEPTION: Uncaught (in promise): Error: Cannot find module 'app/home/home.module'

For Angular 8 and 9, the lazy load declaration changed. Since Angular 8 introduced the new recommended module loading method, previously the default method of lazy loading modules was to specify a string path to a module:

{ path: 'auth', loadChildren: 'src/app/auth/auth.module#AuthModule' }

The method of importing modules has changed to dynamic import. The dynamic import is promise-based and gives you access to the module, where the module’s class can be called. Thus your import should now be changed to:

  { path: 'auth', loadChildren: () => import('src/app/auth/auth.module').then(m => m.AuthModule) }

I landed on this question with very similar symptoms and context, so it seems useful to remark that this answer to another question helped me out.

In my specific case, I was somewhat following the lazy feature modules docs, and I even faithfully tried to replicate the associated StackBlitz example code. For some reason that example gets away with:

loadChildren: 'app/customers/customers.module#CustomersModule'

And even though my Angular CLI (v6) based experiment had similar folder structure, I needed to do either this:

// Full path including `src` at the start:
loadChildren: 'src/app/customers/customers.module#CustomersModule'

or this:

// Relative path from the `app-routing.module.ts` file:
loadChildren: './customers/customers.module#CustomersModule'

No clue why the StackBlitz example gets away with the first code example, but the other two both make sense and work for me when doing ng serve.


You need to change your app-routing.module.ts in import { RouterModule } from '@angular/router';

const routes = [
 {path : '', loadChildren: () => import('./home/home.module').then(m => m.HomeModule) },
 {path: 'devis', loadChildren: () => import('./forms/forms.module').then(m => m.FormsModule) }
];