Lazy Loading on Ionic 5 Tabs project

Ionic Framework Ionic Angular
1

Hi, I am starting new project with Ionic 5- Angular 11 with the tabs template.

To Lazy load components I was doing this following this article an this article:

import { NgModule } from '@angular/core';
import { PreloadAllModules, RouterModule, Routes } from '@angular/router';

const routes: Routes = [
  {
    path: '',
    loadChildren: './tabs/tabs.module#TabsPageModule'
    data: { preload: true },
  }
];
@NgModule({
  imports: [
    RouterModule.forRoot(routes, { preloadingStrategy: PreloadAllModules })
  ],
  exports: [RouterModule]
})
export class AppRoutingModule {}

But when I launch the app with ionic serve ir not loads the app with this error:

ERROR Error: Uncaught (in promise): Error: Cannot find module ‘./tabs/tabs.module’

Can someone help me with this?

2

The tabs starter project should be already setup out of the box for lazy loading. I’d start a new project to see the setup.

3

Hi,

The ionic start lazyTest tabs --cordova command generate this routing routes:

const routes: Routes = [
  {
    path: '',
    loadChildren: () => import('./tabs/tabs.module').then(m => m.TabsPageModule)
  }
];

Has been changed the way to implement Lazy loading on angular 11?

4

This has been the default lazy loading experience for a while now. Since at least Angular 7.0

5

Then,

Can i let this sintax

const routes: Routes = [
{
path: ‘’,
loadChildren: () => import(’./tabs/tabs.module’).then(m => m.TabsPageModule)
}
];

With the strategy mentioned on ionic blog article?

I mean no PreloadAllModiles strategy