Component is part of the declaration of 2 modules Component is part of the declaration of 2 modules angular angular

Component is part of the declaration of 2 modules


Remove the declaration from AppModule, but update the AppModule configuration to import your AddEventModule.

.....import { AddEventModule } from './add-event.module';  // <-- don't forget to import the AddEventModule class@NgModule({  declarations: [    MyApp,    HomePage,    Login,    Register,    //AddEvent,  <--- remove this    EventDetails  ],  imports: [    BrowserModule,    IonicModule.forRoot(MyApp),    HttpModule,    AngularFireModule.initializeApp(config),    AddEventModule,  // <--- add this import here  ],  bootstrap: [IonicApp],  entryComponents: [    MyApp,    HomePage,    Login,    Register,    AddEvent,    EventDetails  ],  providers: [    StatusBar,    SplashScreen,    {provide: ErrorHandler, useClass: IonicErrorHandler}, Eventdata, AuthProvider  ]})export class AppModule {}

Also,

Note that it's important that your AddEventModule exports the AddEvent component if you want to use it outside that module. Luckily, you already have that configured, but if it was omitted, you would've gotten an error if you tried to use the AddEvent component in another component of your AppModule


Some people using Lazy loading are going to stumble across this page.

Here is what I did to fix sharing a directive.

  1. create a new shared module

shared.module.ts

import { NgModule, Directive,OnInit, EventEmitter, Output, OnDestroy, Input,ElementRef,Renderer } from '@angular/core';import { CommonModule } from '@angular/common';import { SortDirective } from './sort-directive';@NgModule({  imports: [  ],  declarations: [  SortDirective  ],  exports: [    SortDirective  ]})export class SharedModule { }

Then in app.module and your other module(s)

import {SharedModule} from '../directives/shared.module'...@NgModule({   imports: [       SharedModule       ....       .... ]})export class WhateverModule { }


Solution is very simple. Find *.module.ts files and comment declarations. In your case find addevent.module.ts file and remove/comment one line below:

@NgModule({  declarations: [    // AddEvent, <-- Comment or Remove This Line  ],  imports: [    IonicPageModule.forChild(AddEvent),  ],})

This solution worked in ionic 3 for pages that generated by ionic-cli and works in both ionic serve and ionic cordova build android --prod --release commands!

Be happy...