在 Ionic 3 中运行发布命令时,Angular AoT 构建失败



我正在尝试在我的索尼Z2智能手机上运行该应用程序。我使用以下命令:

ionic build android --prod --release

我在控制台中收到如下错误:

打字稿错误 在 C:/Users/fearcoder/Documents/natuurkundeformules/src/pages/circkelmovement/circkelmovement.ts 中键入 CirckelmovementPage 是 2 个模块声明的一部分:应用模块 C:/Users/fearcoder/Documents/natuurkundeformules/src/app/app.module.ts 和 C:/Users/fearcoder 中的 CirckelmovementPageModule/Documents/natuurkundeformules/src/pages/circkelmovement/circkelmovement.module.ts!

Please consider moving CirckelmovementPage in

C:/Users/fearcoder/Documents/natuurkundeformules/src/pages/circkelmovement/circkelmovement.ts 到导入 AppModule 的更高模块 C:/Users/fearcoder/Documents/natuurkundeformules/src/app/app.module.ts 和 CirckelmovementPageModule in C:/Users/fearcoder/Documents/natuurkundeformules/src/pages/circkelmovement/circkelmovement.module.ts.

You can also create a new NgModule that exports and includes

Circkelmovement页面在 C:/Users/fearcoder/Documents/natuurkundeformules/src/pages/circkelmovement/circkelmovement.ts 然后导入该 NgModule in AppModule in C:/Users/fearcoder/Documents/natuurkundeformules/src/app/app.module.ts

and CirckelmovementPageModule in

C:/Users/fearcoder/Documents/natuurkundeformules/src/pages/circkelmovement/circkelmovement.module.ts.

这些是文件

Circkelmovement.ts

import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
import { AdMobFree, AdMobFreeBannerConfig } from '@ionic-native/admob-free';
@IonicPage()
@Component({
selector: 'page-circkelmovement',
templateUrl: 'circkelmovement.html',
})
export class CirckelmovementPage {
ray:any;
circulationtime:any;
result:any;
constructor(public navCtrl: NavController, public navParams: NavParams, private admob: AdMobFree) {
} 
ionViewDidLoad(){
const bannerConfig: AdMobFreeBannerConfig = {
isTesting: true,
autoShow: true
};
this.admob.banner.config(bannerConfig);
this.admob.banner.prepare()
.then(() => {
this.admob.banner.show()
})
.catch(e => console.log(e));
}
calculateWebSpeed(ray, circulationtime){      
return this.result = "Baansnelheid: " + (2 * Math.PI * ray / circulationtime) + " m/s";    
}
}

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 { AdMobFree } from '@ionic-native/admob-free';
import { InAppBrowser } from '@ionic-native/in-app-browser';
import { MyApp } from './app.component';
import { HomePage } from '../pages/home/home';
import { SpeedPage } from '../pages/speed/speed';
import { DistancePage } from '../pages/distance/distance';
import { TimePage } from '../pages/time/time';
import { WorkPage } from '../pages/work/work';
import { KinenergyPage } from '../pages/kinenergy/kinenergy';
import { GravityenergyPage } from '../pages/gravityenergy/gravityenergy';
import { GravityforcePage } from '../pages/gravityforce/gravityforce';
import { CirckelmovementPage } from '../pages/circkelmovement/circkelmovement';
import { ElectricityenergyPage } from '../pages/electricityenergy/electricityenergy';
import { LawohmPage } from '../pages/lawohm/lawohm';
import { LenslawPage } from '../pages/lenslaw/lenslaw';
import { LorentzforcewirePage } from '../pages/lorentzforcewire/lorentzforcewire';
import { DensityPage } from '../pages/density/density';
import { PressurePage } from '../pages/pressure/pressure';
import { LensstrenghtPage } from '../pages/lensstrenght/lensstrenght';
import { PowerPage } from '../pages/power/power';
import { CurrentstrenghtPage } from '../pages/currentstrenght/currentstrenght';
import { FrequencyPage } from '../pages/frequency/frequency';
import { WavespeedPage } from '../pages/wavespeed/wavespeed';
import { MassPage } from '../pages/mass/mass';
import { LorentzparticlePage } from '../pages/lorentzparticle/lorentzparticle';
@NgModule({
declarations: [
MyApp,
HomePage,
SpeedPage,
DistancePage,
TimePage,
WorkPage,
KinenergyPage,
GravityenergyPage,
GravityforcePage,
CirckelmovementPage,
ElectricityenergyPage,
LawohmPage,
LenslawPage,
LorentzforcewirePage,
DensityPage,
PressurePage,
LensstrenghtPage,
PowerPage,
CurrentstrenghtPage,
FrequencyPage,
WavespeedPage,
MassPage,  
LorentzparticlePage       
],
imports: [
BrowserModule,
IonicModule.forRoot(MyApp)
],
bootstrap: [IonicApp],
entryComponents: [
MyApp,
HomePage,
SpeedPage,
DistancePage,
TimePage,
WorkPage,
KinenergyPage,
GravityenergyPage,
GravityforcePage,
CirckelmovementPage,
ElectricityenergyPage,
LawohmPage,
LenslawPage,
LorentzforcewirePage,
DensityPage,
PressurePage,
LensstrenghtPage,
PowerPage,
CurrentstrenghtPage,
FrequencyPage,
WavespeedPage,
MassPage,   
LorentzparticlePage    
],
providers: [
StatusBar,
SplashScreen,
AdMobFree,
InAppBrowser,
{provide: ErrorHandler, useClass: IonicErrorHandler}
]
})
export class AppModule {}

Circkelmovement.module.ts

import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { CirckelmovementPage } from './circkelmovement';
@NgModule({
declarations: [
CirckelmovementPage,
],
imports: [
IonicPageModule.forChild(CirckelmovementPage),
],
})
export class CirckelmovementPageModule {}

我已经阅读了此命令,可以解决加载应用程序时的性能问题。我不知道我做错了什么。有人可以指出我正确的方向吗?

亲切问候

因此,当您使用延迟加载的页面时,您根本不需要在此 app.module.ts 中导入或声明这些页面,因为它们将成为其文件夹中自己的模块的一部分。因此,对于所有延迟加载的页面,确实具有:

  • 延迟加载页面自己的命名模块文件在页面中(您似乎有此特定页面的指定模块文件(

  • 在应用逻辑中加载此类页面(例如使用 navCtrl(时,您需要将页面名称用作字符串而不是组件

因此,在您的代码中取消注释您延迟加载的那些页面:

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 { AdMobFree } from '@ionic-native/admob-free';
import { InAppBrowser } from '@ionic-native/in-app-browser';
import { MyApp } from './app.component';
import { HomePage } from '../pages/home/home';
import { SpeedPage } from '../pages/speed/speed';
import { DistancePage } from '../pages/distance/distance';
import { TimePage } from '../pages/time/time';
import { WorkPage } from '../pages/work/work';
import { KinenergyPage } from '../pages/kinenergy/kinenergy';
import { GravityenergyPage } from '../pages/gravityenergy/gravityenergy';
import { GravityforcePage } from '../pages/gravityforce/gravityforce';
// import { CirckelmovementPage } from '../pages/circkelmovement/circkelmovement';
import { ElectricityenergyPage } from '../pages/electricityenergy/electricityenergy';
import { LawohmPage } from '../pages/lawohm/lawohm';
import { LenslawPage } from '../pages/lenslaw/lenslaw';
import { LorentzforcewirePage } from '../pages/lorentzforcewire/lorentzforcewire';
import { DensityPage } from '../pages/density/density';
import { PressurePage } from '../pages/pressure/pressure';
import { LensstrenghtPage } from '../pages/lensstrenght/lensstrenght';
import { PowerPage } from '../pages/power/power';
import { CurrentstrenghtPage } from '../pages/currentstrenght/currentstrenght';
import { FrequencyPage } from '../pages/frequency/frequency';
import { WavespeedPage } from '../pages/wavespeed/wavespeed';
import { MassPage } from '../pages/mass/mass';
import { LorentzparticlePage } from '../pages/lorentzparticle/lorentzparticle';
@NgModule({
declarations: [
MyApp,
HomePage,
SpeedPage,
DistancePage,
TimePage,
WorkPage,
KinenergyPage,
GravityenergyPage,
GravityforcePage,
// CirckelmovementPage,
ElectricityenergyPage,
LawohmPage,
LenslawPage,
LorentzforcewirePage,
DensityPage,
PressurePage,
LensstrenghtPage,
PowerPage,
CurrentstrenghtPage,
FrequencyPage,
WavespeedPage,
MassPage,  
LorentzparticlePage       
],
imports: [
BrowserModule,
IonicModule.forRoot(MyApp)
],
bootstrap: [IonicApp],
entryComponents: [
MyApp,
HomePage,
SpeedPage,
DistancePage,
TimePage,
WorkPage,
KinenergyPage,
GravityenergyPage,
GravityforcePage,
// CirckelmovementPage,
ElectricityenergyPage,
LawohmPage,
LenslawPage,
LorentzforcewirePage,
DensityPage,
PressurePage,
LensstrenghtPage,
PowerPage,
CurrentstrenghtPage,
FrequencyPage,
WavespeedPage,
MassPage,   
LorentzparticlePage    
],
providers: [
StatusBar,
SplashScreen,
AdMobFree,
InAppBrowser,
{provide: ErrorHandler, useClass: IonicErrorHandler}
]
})
export class AppModule {}

还有一件事:确保对应用的命名约定非常小心。我在这里看到:

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

您有不同的选择器和模板 url 文件命名。这会咬你; 以此为指导:https://angular.io/guide/styleguide 或遵循 Ionic 建议如何做到这一点的示例,但理想情况下,文件命名保持一致,例如:

  • 发布页面.html
  • publish.page.module.ts
  • 发布.页面.scss
  • publish.page.ts

最新更新