Angular Network Error 404 Not Found when trying to access lazy loaded page by link address

On the dev environment, if I try to access page by link, the page is module and loaded lazily, network returns 404 Not Found.

{
path: "",
loadChildren: () => import('@modules/desired-module').then((module) => module.DesiredModule),
canActivate: [AuthGuard, UserRolesGuard],
},

@NgModule({
imports: [RouterModule.forRoot(routes, { preloadingStrategy: PreloadAllModules })],
exports: [RouterModule],
})
export class AppRoutingModule {}



I added preloading strategy and it worked in such cases when I open another modules before. BUT, when I directly open the page it shows 404 error.

What can I do to access the link directly and data be fetched without errors?

Continue reading...