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

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


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


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'.

You’ll need to import your components into your page module file.

Doesn’t work… components is just one case. Even with basic pages, same error…

Can you point a github repo for example that works so i can give it a fast look?

:star_struck::star_struck::star_struck: Thanks @SigmundFroyd

Hi just in case anyone else has this issue I had the same issue

I found the following caused an error


because I was using TABS I could use the following soluton…

import { HomePage } from ‘…/home/home’;

export class LoginPage {
HomePage : any = HomePage ;

then were you want to change page add


0 relates to the page index in the TABS menu ie 0,1,2,3,

I have the same problem,
Imagine u have create a new module he’s name is MyImaginyModule, in this module 2 new components
MyFirstComponent, and MySeconComponent
In our module MyImaginyModule.ts we find our two components (MyFirstComponent and MySeconComponent) in declaration like this :
declarations: [
If U need to use this module in another module, U must put this two components exports in our module ( MyImaginyModule )
exports: [
So in our module MyImaginyModule we have two components declared in declarations and exports,
We put our components in exports: [] when we need to use our logic of this module in another module.
In the final when u have to use our MyImaginyModule u have just to import it ur ur other module