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


Я пытаюсь построить приложение ionic 2. Когда я пробую приложение в браузере с ionic serve или запускаю его на эмуляторе, все работает нормально.

но когда я пытаюсь построить его каждый раз ошибка

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

мой модуль составляет

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

и мой add-event.модуль.ТШ

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

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

Если я удалить объявление из модуль я получаю сообщение об ошибке, что страница входа не найдена, при запуске ionic serve

14 59

14 ответов:

удалить декларацию из модуль, но обновить конфигурацию модуль для импорта 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 {}

и

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

решение очень простое. Найти *.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 команды!

быть счастливым...

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

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

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

общий.модуль.ТС

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

потом в приложение.модуль и ваш другой модуль(ы)

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

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

Если ваши страницы создаются с помощью CLI, то он создает файл с имя файла.модуль.ТС тогда вы должны зарегистрировать свой имя файла.модуль.ТС в массиве импорта в приложении.модуль.TS-файл и не вставляйте эту страницу в массив объявлений.

например.

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

в угловой 4. Эта ошибка рассматривается как проблема кэша времени выполнения ng serve.

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

case: 2 импортируйте один компонент в неправильном месте и удалите и замените в правильном модуле, чтобы он рассматривался как проблема с кешем ng. Нужно остановить проект и начать -снова НГ служить, он будет работать, как ожидалось.

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

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

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

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

этого.navCtrl.push (Login); / / правильно

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

этот модуль добавляется автоматически при запуске ионной команды. Однако это не обязательно. Поэтому альтернативным решением является удаление add-event.модуль.ТС из проекта.

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

чтобы превзойти эту ошибку, вы должны начать с удаления всех импорта приложения.модуль.ТС и есть что-то вроде этого :

            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 на string и удалите импорт страниц (если он есть в вашем компоненте приложения )

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 модулей

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

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

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

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

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

и выполнить команду ionic cordova build android --prod -- release его работа в моем приложении

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

работал для меня.

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

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

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