Uncaught Error: Type HomeMainPage is part of the declarations of 2 modules: Please consider moving HomeMainPage to a higher module that imports IonicModule and AppModule

Uncaught Error: Type HomeMainPage is part of the declarations of 2 modules: IonicModule and AppModule! Please consider moving HomeMainPage to a higher module that imports IonicModule and AppModule. You can also create a new NgModule that exports and includes HomeMainPage then import that NgModule in IonicModule and AppModule

Are you using lazy loading?

If so, remove HomeMainPage from app.module.ts.

Otherwise, delete the home-main.module.ts file.

2 Likes

If you have a class named IonicModule in your code, rename it. That’s going to be an extremely confusing conflict with the framework class. Beyond that, you’re going to have to choose one of these options for HomeMainPage and be consistent about it.

Hi SigmundFroyd,
Thanks for your help. I am not using lazy loading. And also I have not this home-main.module.ts file.

Hi rapropos,

Thanks for your reply. I have not found “IonicModule” from whole project. I have this just in below line:
IonicModule.forRoot(MyApp,{tabsPlacement:‘bottom’})

Can you post your entire app.module.ts? I suspect you might have a weird structural typo in it.

Here is the link of app.module.ts file.

The only thing that jumps out at me (which probably isn’t related) is the IonicImageViewerModule in providers. Judging by its name, it probably wants to be in imports instead. Can you confirm that there is no @IonicPage decoration on HomeMainPage?

Yes, There is not @IonicPage decoration on HomeMain page. You can see HomeMainPage in below link. I think Ionic and Agular updated to 3 and 4 version respectively. May be it’s occurring due to this.

I cannot figure out how you could have managed to break open IonicModule, even accidentally, but TypeScript’s rules about declaration merging are rather arcane. Can you see if there are any other instances of @NgModule in your code aside from the previously posted one for the AppModule?

1 Like

I have only one @NgModule. Error is removed after downgrading the Ionic CLI from 3.9.2 to 3.10.3. It’s working fine now.
Thanks you @rapropos for your help and valuable time.

1 Like

That is absolutely bizarre. I don’t see any open issues against CLI that look relevant, but thanks for reporting that in case it comes up again.

It might be worth opening an issue then…

I’m getting this error now, with 4.1.3 CLI

Any fixes?

Edit: nvm, fixed it

Remove all the xxx.module.ts files that get automatically created when you create pages/components/* with Ionic CLI and remove all the @IonicPage annotations above each of the pages class declaration

3 Likes

Well, even though what I said above fixes it, how can i use modules and lazy loading and also be able to build for prod, I mean removing lazy loading is far from solution …

Do you have pages defined in 2 different module definitions?

Such as having a page module file and also having that page defined in app.module.ts

amigo disculpa la ignorancia, me pasa lo mismo mira :frowning: , que comando utilizo para que no suceda esto , o que es lo que cambio

Hi,

Sorry about the late replay.

Yes, I have. So if I wanted to keep the lazy loading, whats the procedure?

Not a problem.

To keep using lazy loading, just remove the page from app.module.ts

Eh, unfortunately - that doesn’t work.

When pages/components/whatever aren’t imported in app.module then the app breaks reporting that it doesn’t recognize stuff, i.e.

Can't bind to 'page' since it isn't a known property of 'posts-component'.