programing

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

newstyles 2023. 6. 3. 08:19

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

저는 이온 2 앱을 만들려고 합니다.브라우저에서 이온 서버로 앱을 시도하거나 에뮬레이터에서 실행하면 모든 것이 정상적으로 작동합니다.

그러나 매번 오류가 발생할 때마다 구축하려고 할 때

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 create 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.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에서 선언을 제거하면 이온 서버를 실행하는 동안 로그인 페이지를 찾을 수 없다는 오류가 표시됩니다.

에서 선언 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 {}

또한.

중요한 것은 다음과 같습니다.AddEventModule를 합니다.AddEvent해당 모듈 외부에서 사용하려는 경우 구성 요소.다행히도 이미 구성되어 있지만, 이 구성이 생략된 경우 다음을 사용하려고 하면 오류가 발생할 수 있습니다.AddEventAppModule

은 부일사는자를 사용합니다.Lazy loading이 페이지를 우연히 보게 될 겁니다

여기 제가 지시사항 공유를 수정하기 위해 한 일이 있습니다.

  1. 새 공유 모듈 생성

shared.vmdk.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두생서 ▁3에-▁both▁in▁this▁that다작▁worked▁solution니▁3▁works▁for동▁in-합▁generated▁pages모▁ionic▁and이▁ionic서두에가▁bycli루지 3.ionic serve그리고.ionic cordova build android --prod --release명령어!

행복하세요...

CLI를 사용하여 페이지를 만든 다음 filename.module.ts로 파일을 만든 경우 filename.module.ts를 app.module.ts 파일의 imports 배열에 등록하고 선언 배열에 페이지를 삽입하지 않아야 합니다.

예를 들면

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

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

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

case:2 잘못된 위치에 하나의 구성 요소를 가져와 Correct 모듈에서 제거하고 교체합니다. 이때 sing server cache 문제로 간주됩니다.프로젝트를 중지하고 서비스를 다시 시작해야 합니다. 예상대로 작동할 것입니다.

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

  1. app에서 pagename.module.ts 파일 제거
  2. pagename.ts 파일의 'ionic-angular'에서 {IonicApp} 가져오기 제거
  3. pagename.ts 파일에서 @IonicPage() 제거

그리고 ionic cordova build android --prod --release 명령을 실행합니다. 내 앱에서 작동합니다.

이 모듈은 이온 명령을 실행하면 자동으로 추가됩니다.하지만 꼭 필요한 것은 아닙니다.따라서 다른 해결책은 프로젝트에서 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개 모듈 선언의 일부입니다.

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

나를 위해 일했습니다.

간단한 해결책,

으로 app.module.ts 및 일및remove/comment 모든것으로 묶인 것add_event 요를추필없다습에 구성 .App.module.t는 생성의는되에 됩니다.ionic cli는 라고 구요성위소별를모때라는 구성 요소를 입니다.components.module.ts.

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

페이지/구성요소에 이미 이온 모듈 파일이 있는 경우 다른 페이지/하위 페이지/구성요소에서 제거하는 것이 아니라면 루트에서 AddEvent 모듈을 제거하라는 오류 메시지가 표시되므로, 사용하려면 가져온 하나의 모듈 파일에만 마지막 페이지/구성요소가 있어야 합니다.

특히, 여러 페이지에서 필요한 경우 루트 모듈을 추가하고 특정 페이지에서 한 페이지에서만 유지해야 합니다.

실수로 라이브러리의 구성 요소와 동일한 이름으로 내 구성 요소를 만들었습니다.

IDE를 사용하여 구성 요소의 라이브러리를 자동으로 가져올 때 잘못된 라이브러리를 선택했습니다.

따라서 이 오류는 제가 구성 요소를 다시 선언하는 이라고 불평했습니다.

라이브러리 대신 내 구성 요소의 코드에서 가져와 수정했습니다.

저는 또한 다른 이름을 붙임으로써 고칠 수 있습니다: 모호함을 피하세요.

이 시나리오에서는 여러 모듈에서 사용 중인 모든 구성 요소를 가져오는 다른 공유 모듈을 만듭니다.

공유 구성 요소에서 해당 구성 요소를 선언합니다.그런 다음 앱 모듈뿐만 아니라 액세스하려는 다른 모듈에서도 공유 모듈을 가져옵니다.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모듈은 이 경우 오류를 나타낼 수 있습니다.

언급URL : https://stackoverflow.com/questions/43598311/component-is-part-of-the-declaration-of-2-modules