Lazy loading is the best way to separate component into different modules. For large application lazy loading help structure routes for easy readability and fast page load.
How to setup lazy loading in angular
1.Create Modules for route you intent to lazy load
ng g m @module/main --routing
2.Add components to the new module created
ng g c components/home --m @module/main
This automatically adds home to the main module
3.Setting up route in main module
const routes: Routes = [
{
path: '',
component: HomeComponent
}
];
4.Finally lazy load Main Route in your application route or (App Route)
const routes: Routes = [
{
path: '',
loadChildren: () => import('./main/main.module').then(m => m.MainModule)
}
];
Thanks for reading
Top comments (0)