컴포넌트는 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

내 AppModule은

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.module.ts는

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

선언 중 하나를 제거해야한다는 것을 이해하지만 방법을 모르겠습니다.

AppModule에서 선언을 제거하면 ionic serve를 실행하는 동안 로그인 페이지를 찾을 수 없다는 오류가 발생합니다.

에서 선언을 제거 AppModule하지만, 업데이트 AppModule가져 오기 위해 구성 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 {}

또한,

중요합니다. AddEventModuleAddEvent해당 모듈 외부에서 사용하려는 경우 구성 요소를 내보내는 . 다행히도 이미 구성되어 있지만 생략 된 경우 AddEvent다른 구성 요소에서 구성 요소 를 사용하려고하면 오류가 발생 합니다.AppModule

사용 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-cli에 의해 생성 된 페이지에 대해 ionic 3에서 작동했으며 ionic serve및 ionic cordova build android --prod --release명령 모두에서 작동 합니다!

행복하세요 ...

IN Angular 4.이 오류는 런타임 캐시 문제로 간주됩니다.

case : 1이 오류가 발생하면 한 모듈에서 구성 요소를 가져오고 다시 하위 모듈로 가져 오기가 발생합니다.

case : 2 하나의 구성 요소를 잘못된 위치에 가져오고 올바른 모듈에서 제거 및 교체 한 경우 캐시 문제로 간주됩니다. 프로젝트를 중지하고 서비스를 다시 시작해야합니다. 예상대로 작동합니다.

CLI를 사용하여 페이지를 만든 경우 filename.module.ts 가있는 파일을 만든 다음 app.module.ts 파일의 imports 배열에 filename.module.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,
],

이 모듈은 ionic 명령을 실행할 때 자동으로 추가됩니다. 그러나 그것은 필수가 아닙니다. 따라서 대체 솔루션은 프로젝트에서 add-event.module.ts 를 제거 하는 것입니다.

이 솔루션을 시도해 볼 수 있습니다 (Ionic 3 용)

제 경우에는 다음 코드를 사용하여 페이지를 호출 할 때이 오류가 발생합니다.

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

다음과 같은 따옴표를 제거하고 로그인 페이지라고 부르는 파일 상단에 해당 페이지를 가져 왔습니다.

this.navCtrl.push (로그인); // 맞음

초급 개발자이기 때문에 지금은 차이점을 설명 할 수 없습니다.

Ionic 3.6.0 릴리스 이후 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 개 모듈 선언의 일부입니다.

해결-구성 요소는 2 개 모듈 선언의 일부입니다.

1. 앱에서 pagename.module.ts 파일 제거
2. 'ionic-angular'에서 import {IonicApp} 제거; pagename.ts 파일
3. pagename.ts 파일에서 @IonicPage () 제거

그리고 ionic cordova build android --prod --release its Working in my app 명령을 실행하십시오.

같은 문제가있었습니다. AppModule을 제외한 "선언"에서 모든 모듈을 제거해야합니다.

나를 위해 일했습니다.

간단한 수정,

당신의 이동 app.module.ts파일과 remove/comment모든 것을 그 바인딩과 함께 add_event. 에 App.module.t의해 생성 된에 컴포넌트를 추가 할 필요가 없습니다. ionic cli라는 컴포넌트에 대해 별도의 모듈을 생성하기 때문입니다.components.module.ts .

필요한 모듈 구성 요소 가져 오기가 있습니다.

오류가 페이지 / 구성 요소에 이미 ionic 모듈 파일이있는 경우 루트에서 모듈 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.