Компонент является частью объявления 2 модулей

Некоторые люди, использующие Lazy loading, могут наткнуться на эту страницу.

Вот что я сделал, чтобы исправить совместное использование директивы.

1. создать новый общий модуль

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

Затем в app.module и других ваших модулях

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

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

Решение очень простое. Найдите *.module.ts файлы и комментарии к объявлениям. В вашем случае найдите addevent.module.ts файл и удалите / прокомментируйте одну строку ниже:

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

Это решение работало в ionic 3 для страниц, созданных с помощью ionic-cli, и работает как в ionic serve, так и в ionic cordova build android --prod --release командах!

Будь счастлив...

IN Angular 4. Эта ошибка рассматривается как проблема с кешем времени выполнения ng serve.

case: 1 эта ошибка возникнет, если вы импортируете компонент в один модуль и снова произойдет импорт в подмодулях.

case: 2 Импортируйте один компонент в неправильное место и удалите и замените его в правильном модуле. На этот раз он считает проблему с кешем ng serve. Необходимо Остановить проект и запустить -do again ng serve, он будет работать должным образом.

Если ваши страницы созданы с помощью интерфейса командной строки, тогда он создает файл с filename.module.ts, тогда вам необходимо зарегистрировать свой filename.module.ts в массиве импорта в приложении. module.ts и не вставляйте эту страницу в массив объявлений.

eg.

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,
],

Этот модуль добавляется автоматически при запуске команды ionic. Однако это не обязательно. Таким образом, альтернативным решением является удаление add-event.module.ts из проекта.

Вы можете просто попробовать это решение (для Ionic 3)

В моем случае эта ошибка возникает, когда я вызываю страницу с помощью следующего кода

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

Я просто удалил кавычки, подобные приведенным ниже, и также импортировал эту страницу в верхнюю часть файла, который я использовал, вызывая страницу входа в систему.

this.navCtrl.push (Вход); // Верный

Я не могу объяснить разницу в настоящее время, так как я разработчик начального уровня

Начиная с версии Ionic 3.6.0 Release каждая страница, созданная с помощью Ionic-CLI, теперь является модулем Angular. Это означает, что вы должны добавить модуль к импортируемым файлам в файле src/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 {}

Чтобы обойти эту ошибку, вы должны начать с удаления всего импорта app.module.ts и получить что-то вроде этого:

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

Затем отредактируйте модуль страниц, например:

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

Затем добавьте аннотацию IonicPage перед компонентной аннотацией всех страниц:

import { IonicPage } from 'ionic-angular';

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

Затем отредактируйте свой тип rootPage, чтобы он был строковым, и удалите импорт страниц (если он есть в вашем компоненте приложения)

rootPage: string = 'HomePage';

Тогда функция навигации должна быть такой:

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

Вы можете найти источник этого решения здесь: Компонент является частью объявления 2 модулей

Решено - компонент является частью объявления двух модулей

1. Удалить файл pagename.module.ts в приложении
2. Удалите import {IonicApp} из 'ionic-angular'; в файле pagename.ts
3. Удалите @IonicPage () из файла pagename.ts

И запустите команду ionic cordova build android --prod --release. Она работает в моем приложении.

Была такая же проблема. Просто убедитесь, что вы удалили все вхождения модуля в «объявлениях», кроме AppModule.

Работал у меня.

Простое исправление,

Перейдите в свой app.module.ts файл и remove/comment все, что связывается с add_event. Нет необходимости добавлять компоненты к App.module.t, которые генерируются ionic cli, потому что он создает отдельный модуль для компонентов с именем components.module.ts.

Он имеет необходимый импорт компонентов модуля

Поскольку ошибка говорит об удалении модуля AddEvent из корня, если ваша страница / компонент уже имеет файл ионного модуля, если не просто удалить его с другой / дочерней страницы / компонента, на конечной странице / компоненте должен присутствовать только один файл модуля импортированный, если будет использоваться.

В частности, вы должны добавить корневой модуль, если он требуется на нескольких страницах, и если на определенных страницах, сохраните его только на одной странице.

Я случайно создал свой собственный компонент с тем же именем, что и компонент библиотеки.

Когда я использовал свою IDE для автоматического импорта библиотеки для компонента, я выбрал не ту библиотеку.

Поэтому эта ошибка жаловалась, что я повторно объявлял компонент.

Я исправил, импортировав из собственного кода компонента, а не из библиотеки.

Я мог бы также исправить это, назвав по-другому: избегайте двусмысленности.

В этом сценарии создайте еще один общий модуль в этом импорте всего компонента, который используется в нескольких модулях.

В общем компоненте. объявить эти компоненты. А затем импортируйте общий модуль в appmodule, а также в другой модуль, к которому вы хотите получить доступ. Он будет работать на 100%, я сделал это, и он заработал.

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

У меня была такая же ошибка, но я обнаружил, что когда вы импортируете AddEventModule, вы не можете импортировать модуль AddEvent, так как в этом случае он представит ошибку.