El componente es parte de la declaración de 2 módulos

Intento crear una aplicación ionic 2. Cuando pruebo la aplicación en el navegador con servicio iónico o la ejecuto en un emulador, todo funciona bien.

Pero cuando trato de construirlo cada vez que el error

ionic-app-script tast: "build"
Error Type AddEvent in "PATH"/add.event.ts is part of the declarations of 2 modules: AppModule in "PATH"/app.modules.ts and AddEvent in "PATH"/add-event.module.ts.
Please consider moving AddEvent in "PATH"/add-event.ts to a higher module that imports AppModule in "PATH"/app.module.ts and AddEventModule.
You can also creat a new NgModule that exports and includes AddEvent then import that NgModule in AppModule and AddEventModule

mi AppModule es

import { NgModule, ErrorHandler } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { IonicApp, IonicModule, IonicErrorHandler } from 'ionic-angular';
import { AngularFireModule } from 'angularfire2';
import { MyApp } from './app.component';
import { Eventdata } from '../providers/eventdata';
import { AuthProvider } from '../providers/auth-provider';
import { HttpModule } from '@angular/http';

import { HomePage } from '../pages/home/home';
import { Login } from '../pages/login/login';
import { Register } from '../pages/register/register';
import { AddEvent } from '../pages/add-event/add-event';
import { EventDetails } from '../pages/event-details/event-details';

import { StatusBar } from '@ionic-native/status-bar';
import { SplashScreen } from '@ionic-native/splash-screen';


@NgModule({
  declarations: [
    MyApp,
    HomePage,
    Login,
    Register,
    AddEvent,
    EventDetails

  ],
  imports: [
    BrowserModule,
    IonicModule.forRoot(MyApp),
    HttpModule,
    AngularFireModule.initializeApp(config)
  ],
  bootstrap: [IonicApp],
  entryComponents: [
    MyApp,
    HomePage,
    Login,
    Register,
    AddEvent,
    EventDetails
  ],
  providers: [
    StatusBar,
    SplashScreen,
    {provide: ErrorHandler, useClass: IonicErrorHandler}, Eventdata, AuthProvider
  ]
})
export class AppModule {}

y mi add-event.module.ts es

import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { AddEvent } from './add-event';

@NgModule({
  declarations: [
    AddEvent,
  ],
  imports: [
    IonicPageModule.forChild(AddEvent),
  ],
  exports: [
    AddEvent
  ]
})
export class AddEventModule {}

Entiendo que tengo que eliminar una de las declaraciones, pero no sé cómo.

Si elimino la declaración de AppModule, aparece un error que indica que no se encuentra la página de inicio de sesión, mientras ejecuto ionic serve

Elimine la declaración de AppModule, pero actualice la AppModuleconfiguración para importar su 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 {}

También,

Tenga en cuenta que es importante que AddEventModuleexporte el AddEventcomponente si desea utilizarlo fuera de ese módulo. Afortunadamente, ya lo tiene configurado, pero si se omitió, habría recibido un error si intentó usar el AddEventcomponente en otro componente de suAppModule

Algunas personas que usan Lazy loadingse encontrarán con esta página.

Esto es lo que hice para corregir el uso compartido de una directiva .

1. crear un nuevo módulo compartido

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 { }

Luego, en app.module y sus otros módulos

import {SharedModule} from '../directives/shared.module'
...

@NgModule({
   imports: [
       SharedModule
       ....
       ....
 ]
})
export class WhateverModule { }

La solución es muy sencilla. Encuentre *.module.tsarchivos y declaraciones de comentarios. En su caso, busque el addevent.module.tsarchivo y elimine / comente una línea a continuación:

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

¡Esta solución funcionó en ionic 3 para las páginas generadas por ionic-cli y funciona en ambos comandos ionic servey ionic cordova build android --prod --release!

Sea feliz...

IN Angular 4. Este error se considera un problema de caché en tiempo de ejecución ng.

caso: 1 este error ocurrirá, una vez que importe el componente en un módulo y nuevamente ocurrirá la importación en submódulos.

caso: 2 Importe un componente en el lugar incorrecto y lo eliminó y reemplazó en el módulo correcto, esa vez se considera como un problema de caché de servicio. Es necesario detener el proyecto y comenzar a hacer nuevamente el servicio, funcionará como se esperaba.

Si sus páginas se crean mediante CLI, entonces crea un archivo con filename.module.ts, luego debe registrar su filename.module.ts en la matriz de importaciones en el archivo app.module.ts y no inserte esa página en la matriz de declaraciones .

p.ej.

import { LoginPageModule } from '../login/login.module';


declarations: [
    MyApp,
    LoginPageModule,// remove this and add it below array i.e. imports
],

imports: [
        BrowserModule,
        HttpModule,
        IonicModule.forRoot(MyApp, {
           scrollPadding: false,
           scrollAssist: true,
           autoFocusAssist: false,
           tabsHideOnSubPages:false
        }),
       LoginPageModule,
],

Este módulo se agrega automáticamente cuando ejecuta el comando iónico. Sin embargo, no es necesario. Entonces, una solución alternativa es eliminar add-event.module.ts del proyecto.

Puede probar esta solución (para Ionic 3)

En mi caso, este error ocurre cuando llamo a una página usando el siguiente código

 this.navCtrl.push("Login"); // Bug

Acabo de eliminar las comillas como las siguientes y también importé esa página en la parte superior del archivo que usé para llamar a la página de inicio de sesión

this.navCtrl.push (Iniciar sesión); // Correcto

No puedo explicar la diferencia en este momento ya que soy un desarrollador de nivel principiante

Desde el lanzamiento de Ionic 3.6.0 , cada página generada con Ionic-CLI es ahora un módulo angular. Esto significa que debe agregar el módulo a sus importaciones en el archivosrc/app/app.module.ts

import { BrowserModule } from "@angular/platform-browser";
import { ErrorHandler, NgModule } from "@angular/core";
import { IonicApp, IonicErrorHandler, IonicModule } from "ionic-angular";
import { SplashScreen } from "@ionic-native/splash-screen";
import { StatusBar } from "@ionic-native/status-bar";;

import { MyApp } from "./app.component";
import { HomePage } from "../pages/home/home"; // import the page
import {HomePageModule} from "../pages/home/home.module"; // import the module

@NgModule({
  declarations: [
    MyApp,
  ],
  imports: [
    BrowserModule,
    IonicModule.forRoot(MyApp),
    HomePageModule // declare the module
  ],
  bootstrap: [IonicApp],
  entryComponents: [
    MyApp,
    HomePage, // declare the page
  ],
  providers: [
    StatusBar,
    SplashScreen,
    { provide: ErrorHandler, useClass: IonicErrorHandler },
  ]
})
export class AppModule {}

Para superar este error, debe comenzar eliminando todas las importaciones de app.module.ts y tener algo como esto:

            import { BrowserModule } from '@angular/platform-browser';
            import { HttpClientModule } from '@angular/common/http';
            import { ErrorHandler, NgModule } from '@angular/core';
            import { IonicApp, IonicErrorHandler, IonicModule } from 'ionic-angular';
            import { SplashScreen } from '@ionic-native/splash-screen';
            import { StatusBar } from '@ionic-native/status-bar';

            import { MyApp } from './app.component';


            @NgModule({
              declarations: [
                MyApp
              ],
              imports: [
                BrowserModule,
                HttpClientModule,
                IonicModule.forRoot(MyApp)
              ],
              bootstrap: [IonicApp],
              entryComponents: [
                MyApp
              ],
              providers: [
                StatusBar,
                SplashScreen,
                {provide: ErrorHandler, useClass: IonicErrorHandler}
              ]
            })
            export class AppModule {}

A continuación, edite el módulo de páginas, así:

            import { NgModule } from '@angular/core';
            import { IonicPageModule } from 'ionic-angular';
            import { HomePage } from './home';

            @NgModule({
              declarations: [
                HomePage,
              ],
              imports: [
                IonicPageModule.forChild(HomePage),
              ],
              entryComponents: [HomePage]
            })
            export class HomePageModule {}

Luego agregue la anotación de IonicPage antes de la anotación del componente de todas las páginas:

import { IonicPage } from 'ionic-angular';

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

Luego edite su tipo de rootPage para que sea una cadena y elimine las importaciones de páginas (si hay alguna en el componente de su aplicación)

rootPage: string = 'HomePage';

Entonces la función de navegación debería ser así:

 /**
* Allow navigation to the HomePage for creating a new entry
*
* @public
* @method viewHome
* @return {None}
*/
 viewHome() : void
 {
  this.navCtrl.push('HomePage');
 }

Puede encontrar la fuente de esta solución aquí: El componente es parte de la declaración de 2 módulos

Resuelto: el componente es parte de la declaración de 2 módulos

1. Eliminar el archivo pagename.module.ts en la aplicación
2. Elimina la importación {IonicApp} de 'ionic-angular'; en el archivo pagename.ts
3. Eliminar @IonicPage () del archivo pagename.ts

Y ejecute el comando ionic cordova build android --prod - libere su funcionamiento en mi aplicación

Tuvo el mismo problema. Solo asegúrese de eliminar todas las apariciones de módulo en "declaraciones" excepto AppModule.

Trabajó para mi.

Arreglo simple,

Vaya a su app.module.tsarchivo y remove/commenttodo lo que se vincula con add_event. No es necesario agregar componentes a los App.module.tmensajes de correo electrónico que genera el, ionic cliporque crea un módulo separado para los componentes llamados components.module.ts.

Tiene las importaciones de componentes de módulo necesarias

Como el error dice que elimine el módulo AddEvent de la raíz si su página / componente ya tiene un archivo de módulo iónico, si no simplemente elimínelo de la otra página / componente secundario, en la página final / componente debe estar presente en un solo archivo de módulo importado si se va a utilizar.

Específicamente, debe agregar el módulo raíz si es necesario en varias páginas y, si está en páginas específicas, mantenerlo en una sola página.

Accidentalmente creé mi propio componente con el mismo nombre que el componente de una biblioteca.

Cuando utilicé mi IDE para importar automáticamente la biblioteca del componente, elegí la biblioteca incorrecta.

Por lo tanto, este error se estaba quejando, que estaba volviendo a declarar el componente.

Lo arreglé importando desde el código de mi propio componente, en lugar de la biblioteca.

También podría solucionarlo nombrando de manera diferente: evitar la ambigüedad.

En este escenario, cree otro módulo compartido para importar todos los componentes que se están utilizando en varios módulos.

En componente compartido. declarar esos componentes. Y luego importe el módulo compartido en appmodule, así como en otro módulo al que desee acceder. Funcionará al 100%, hice esto y lo hice funcionar.

@NgModule({
    declarations: [HeaderComponent, NavigatorComponent],
    imports: [
        CommonModule, BrowserModule,
        AppRoutingModule,
        BrowserAnimationsModule,
        FormsModule,
    ] 
})
export class SharedmoduleModule { }
const routes: Routes = [
{
    path: 'Parent-child-relationship',
    children: [
         { path: '', component: HeaderComponent },
         { path: '', component: ParrentChildComponent }
    ]
}];
@NgModule({
    declarations: [ParrentChildComponent, HeaderComponent],
    imports: [ RouterModule.forRoot(routes), CommonModule, SharedmoduleModule ],
    exports: [RouterModule]
})
export class TutorialModule {
}
imports: [
    BrowserModule,
    AppRoutingModule,
    BrowserAnimationsModule,
    FormsModule,
    MatInputModule,
    MatButtonModule,
    MatSelectModule,
    MatIconModule,
    SharedmoduleModule
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }

Tuve el mismo error, pero descubrí que cuando AddEventModuleimporta un AddEventmódulo , no puede importar un módulo, ya que presentaría un error en este caso.