[英]Page is part of the declarations of 2 modules: Error in ionic build prod
當我運行npm run ionic:build我能夠成功構建。 但是,當我運行npm run ionic:build --prod我收到以下錯誤消息。
Error: Type PatientDetailPage in /home/shiva/Ionic/af2-lists/src/pages/patient-detail/patient-detail.ts is
part of the declarations of 2 modules: AppModule in /home/shiva/Ionic/af2-lists/src/app/app.module.ts and
PatientDetailPageModule in /home/shiva/Ionic/af2-lists/src/pages/patient-detail/patient-detail.module.ts!
Please consider moving PatientDetailPage in
/home/shiva/Ionic/af2-lists/src/pages/patient-detail/patient-detail.ts to a higher module that imports
AppModule in /home/shiva/Ionic/af2-lists/src/app/app.module.ts and PatientDetailPageModule in
/home/shiva/Ionic/af2-lists/src/pages/patient-detail/patient-detail.module.ts. You can also create a new
NgModule that exports and includes PatientDetailPage in
/home/shiva/Ionic/af2-lists/src/pages/patient-detail/patient-detail.ts then import that NgModule in
AppModule in /home/shiva/Ionic/af2-lists/src/app/app.module.ts and PatientDetailPageModule in
/home/shiva/Ionic/af2-lists/src/pages/patient-detail/patient-detail.module.ts.
Error: Type PatientDetailPage in /home/shiva/Ionic/af2-lists/src/pages/patient-detail/patient-detail.ts is part of the declarations of 2 modules: AppModule in /home/shiva/Ionic/af2-lists/src/app/app.module.ts and PatientDetailPageModule in /home/shiva/Ionic/af2-lists/src/pages/patient-detail/patient-detail.module.ts! Please consider moving PatientDetailPage in /home/shiva/Ionic/af2-lists/src/pages/patient-detail/patient-detail.ts to a higher module that imports AppModule in /home/shiva/Ionic/af2-lists/src/app/app.module.ts and PatientDetailPageModule in /home/shiva/Ionic/af2-lists/src/pages/patient-detail/patient-detail.module.ts. You can also create a new NgModule that exports and includes PatientDetailPage in /home/shiva/Ionic/af2-lists/src/pages/patient-detail/patient-detail.ts then import that NgModule in AppModule in /home/shiva/Ionic/af2-lists/src/app/app.module.ts and PatientDetailPageModule in /home/shiva/Ionic/af2-lists/src/pages/patient-detail/patient-detail.module.ts.
at syntaxError (/home/shiva/Ionic/af2-lists/node_modules/@angular/compiler/bundles/compiler.umd.js:1550:34)
at CompileMetadataResolver._addTypeToModule (/home/shiva/Ionic/af2-lists/node_modules/@angular/compiler/bundles/compiler.umd.js:14655:31)
at /home/shiva/Ionic/af2-lists/node_modules/@angular/compiler/bundles/compiler.umd.js:14543:27
at Array.forEach (native)
at CompileMetadataResolver.getNgModuleMetadata (/home/shiva/Ionic/af2-lists/node_modules/@angular/compiler/bundles/compiler.umd.js:14534:54)
at addNgModule (/home/shiva/Ionic/af2-lists/node_modules/@angular/compiler/bundles/compiler.umd.js:23050:58)
at /home/shiva/Ionic/af2-lists/node_modules/@angular/compiler/bundles/compiler.umd.js:23061:14
at Array.forEach (native)
at _createNgModules (/home/shiva/Ionic/af2-lists/node_modules/@angular/compiler/bundles/compiler.umd.js:23060:26)
at analyzeNgModules (/home/shiva/Ionic/af2-lists/node_modules/@angular/compiler/bundles/compiler.umd.js:22935:14)
我知道我多次加載相同的模塊,但無法理解如何刪除它們。
我的app.module.ts
@NgModule({
imports: [
BrowserModule,
IonicModule.forRoot(MyApp),
AngularFireDatabaseModule,
AngularFireModule.initializeApp(firebaseConfig),
AngularFireOfflineModule,
IonicStorageModule.forRoot()
// PatientDetailPage
],
declarations: [
MyApp,
HomePage,
PatientDetailPage
],
entryComponents: [
MyApp,
HomePage,
PatientDetailPage
],
providers: [
StatusBar,
SplashScreen,
//AngularFireModule,
//Storage,
{provide: ErrorHandler, useClass: IonicErrorHandler}
],
bootstrap: [IonicApp],
})
patient-detail.module.ts是
import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { PatientDetailPage } from './patient-detail';
@NgModule({
declarations: [
PatientDetailPage,
],
imports: [
IonicPageModule.forChild(PatientDetailPage),
]
})
export class PatientDetailPageModule {
}
這是角度的基本誤差。 你可以在這里看到問題。 所以到目前為止接受的答案是使用共享模塊。 你可以這樣做:
- 創建一個share.module.ts
- 在此share.module.ts
Import
, declaration
和export
組件
import { NgModule } from '@angular/core';
import {SharedComponentA} from "./SharedComponentA";
import {SharedComponentB} from "./SharedComponentB";
@NgModule({
imports: [
],
declarations: [
SharedComponentA,
SharedComponentB
],
providers: [
],
exports: [
SharedComponentA,
SharedComponentB
]
})
export class SharedModule {}
- 如果要在Ionic頁面(延遲加載頁面)中使用組件,請在該Ionic頁面的模塊中導入共享模塊:
import {SharedModule } from './SharedModule';
@NgModule({
imports: [
SharedModule
//..
],
//..
})
- 如果要在其他組件中使用組件或不使用延遲加載頁面,請在app.module.ts中導入共享模塊,如上所述。
了解有關ngModule的更多信息
如果在模塊中使用組件作為entryComponent,則無需在模塊中聲明它。 嘗試從PatientDetailPage
的declarations
刪除app.module.ts
。
所以,在我看來,要做到這一點的最好辦法是export
你的PatientDetailPage
從你出來PatientDetailModule
並導入PatientDetailModule
到您的應用程序模塊。
應用模塊
@NgModule({
imports: [
BrowserModule,
IonicModule.forRoot(MyApp),
AngularFireDatabaseModule,
AngularFireModule.initializeApp(firebaseConfig),
AngularFireOfflineModule,
PatientDetailModule,
IonicStorageModule.forRoot()
// PatientDetailPage
],
declarations: [
MyApp,
HomePage
],
entryComponents: [
MyApp,
HomePage,
PatientDetailPage
],
providers: [
StatusBar,
SplashScreen,
//AngularFireModule,
//Storage,
{provide: ErrorHandler, useClass: IonicErrorHandler}
],
bootstrap: [IonicApp],
})
患者模塊
import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { PatientDetailPage } from './patient-detail';
@NgModule({
declarations: [
PatientDetailPage,
],
imports: [
IonicPageModule.forChild(PatientDetailPage),
],
exports: [
PatientDetailPage
]
})
export class PatientDetailPageModule {
}
您不需要在app.module.ts
上app.module.ts
有關PatientDetailPageModule
任何內容。因此,請刪除PatientDetailPageModule
所有引用。如果您需要在另一個組件中使用PatientDetailPageModule
模塊,則只需import
如下所示。
another.module.ts
@NgModule({
imports: [
PatientDetailPageModule,
],
})
使用Cordova構建 :
ionic cordova build android --prod
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.