Cannot read property 'loadChildren' of undefined

Question

Following is my router page:

export const AppRoutes: Routes = [
{
   path: '',
   component: PublicComponent,
   children: [
   {
    path: '',redirectTo: '/',pathMatch: 'full'
   },
   {
    path: 'home',loadChildren: () => HomeModule
   }
 ]
} ,
{
  path: '',component: AdminComponent, children: [
  {
    path: 'dashboard', loadChildren: () => DashboardModule
  }, {...}
 ]
},
{ path: '**', redirectTo: '/home', pathMatch: 'full' }
];

@NgModule({
imports: [
 RouterModule.forRoot(AppRoutes, {scrollPositionRestoration: 'enabled'})
],
exports: [RouterModule]
})

---

When I run the project for the first time, it gives me the above error.

Note:I'm implementing lazy loading approach.

Answer 1

I'm not really familiar with the syntax you've used for loadChildren. Try this instead:

loadChildren: './path/to/your.module#YourModule

This GitHub issue suggests that fix. It looks like the issue here may be similar: https://github.com/angular/angular/issues/31206