Ionic-app-scripts: Ionic 3 lazy loading - invalid link : TabsPage

[panzhu]

Hi, I try to use ionic3 lazyloading feature.

But I'm getting following error:
Uncaught (in promise): Error: Cannot find module '../pages/tabs/tabs.module'. Error: Cannot find module '../pages/tabs/tabs.module'

My Tabspage has a module class "tabs.module.ts" which looks fine.

import {NgModule} from "@angular/core";
import {TabsPage} from "./tabs";
import {IonicPageModule} from "ionic-angular";

@NgModule({
declarations: [TabsPage,],
imports: [IonicPageModule.forChild(TabsPage),],
exports: [TabsPage,]
})

export class TabsPageModule {
}

and in app.components.ts the link looks like

rootPage : string = "TabsPage";

May somebody can help me?

Which @ionic/app-scripts version are you using?

Ionic Framework: 3.1.1
Ionic App Scripts: 1.3.6
Angular Core: 4.0.2
Angular Compiler CLI: 4.0.2
Node: 6.10.2
OS Platform: Windows 10
Navigator Platform: Win32
User Agent: Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/59.0.3053.3 Safari/537.36

[bvx89]

I'm quite certain that you have a reference to '../pages/tabs/tabs.module' inside your project somewhere. Search the entire project and remove that reference. Also, make sure you do not include the tabs module inside your app.module.ts.

[danbucholtz]

Hi @panzhu,

It would be very tough to help without a repository where we can see what the issue is 🐱

We use Github to track problems with the code itself, so I kindly ask that you ask your question on our Ionic forum. Members of the community and Ionic staff hang out there to help one another.

Thanks,
Dan

[NorlanT]

Hi,
In the tabs.module.ts make sure to add the IonicPage or you will go crazy looking for the error
import { IonicPage, NavController, NavParams } from 'ionic-angular';

@IonicPage()
@component

[kavinda1995]

@NorlanT
Thanks man. It worked. Helped me a lot :)

[sumitg837]

@NorlanT
Thanks , worked for me

[hashanmalawana]

Thanks,Worked for me too

[gelinger777]

@NorlanT I have got the same problem :( And the hack with IonicPage does not work. I am using Ionic

Everything was working fine, but After I have installed the pouchdb, and made "allowSyntheticDefaultImports": true this error shoed up. Even if I am removing them it does not go away...
Any ideas how to fix this in latest Ionic?

[muhammadumerfarooq]

i am sharing my experience as in my case i had declared class like this

@IonicPage()
@Component({
selector: 'page-login',
templateUrl: 'login.html',
})

export class logininfo {
 name: string;
}

export class loginPage {
  // code
}

as seen here the declared class is before the declaration of page class that's why it was saying invalid error, but after remiving the logininfo class the link was working