I followed the tutorial of david east to make an angular universal app and deploy it on firebase hosting. I tried this and it worked with normal routes but with lazy loaded routing it did not work. here is the screen shot of the view page source, view page source
why this is not working when routing? Can someone tell me how to configure Server side rendering for lazy loading or share any links about it?
You can check this guide from the official Angular CLI docs how to make lazy loading work if you do ssr with the angular cli. It's the same method as in your video tutorial.
However, until few days ago, it had the following statement at the bottom which was saying:
Caveats
- Lazy loading is not yet supported, but coming very soon. Currently lazy loaded routes aren't available for prerendering, and you will get a
System is not definederror.
If you look at the revision history, you can see that it just was changed to revision 1.5.0-beta.4. Probably you have to upgrade your CLI to that version to make it work that way.
i found a solution in this article about lazy loading components : https://blog.khophi.co/angular-module-lazy-loading-like-pro/
import { ModuleWithProviders } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
const appRoutes: Routes = [
{ path: '/', loadChildren: './home/home.module#HomeModule' },
{ path: 'about', loadChildren: './about/about.module#AboutModule'},
];
export const AppRouting: ModuleWithProviders =
RouterModule.forRoot(appRoutes);