黑屏 - Angular JIT 编译失败:“@angular/compiler”未加载
Blank Screen - Angular JIT compilation failed: '@angular/compiler' not loaded
我目前在使用 Ionic 5 和 Angular 9 项目时遇到问题。
ionic cordova run android
效果很好
但是我 运行 ionic cordova run android --prod
我唯一得到的就是空白屏幕。
chrome 开发工具的输出:
Error: Angular JIT compilation failed: '@angular/compiler' not loaded!
- JIT compilation is discouraged for production use-cases! Consider AOT mode instead.
- Did you bootstrap using '@angular/platform-browser-dynamic' or '@angular/platform-server'?
- Alternatively provide the compiler with 'import "@angular/compiler";' before bootstrapping.
at J (main-es2015.a75ef42b05ed5a68eecb.js:1)
at Function.get (main-es2015.a75ef42b05ed5a68eecb.js:1)
at Gt (main-es2015.a75ef42b05ed5a68eecb.js:1)
at Ji (main-es2015.a75ef42b05ed5a68eecb.js:1)
at main-es2015.a75ef42b05ed5a68eecb.js:1
at Yi.processProvider (main-es2015.a75ef42b05ed5a68eecb.js:1)
at main-es2015.a75ef42b05ed5a68eecb.js:1
at main-es2015.a75ef42b05ed5a68eecb.js:1
at Array.forEach (<anonymous>)
at Ot (main-es2015.a75ef42b05ed5a68eecb.js:1)
我已经检查了以下解决方法,但是 none 对我的项目有效:
- Angular JIT compilation failed: '@angular/compiler' not loaded
如果我在 angular.js 中将 aot 和 buildOptimizer 设置为 false,我可以 运行 ionic cordova run android --prod
而不会出现任何错误,但是当我尝试使用 ionic cordova build android --prod --release
生成 apk 时再打开,又是一片空白
我目前在 package.json 中的依赖项是:
"dependencies": {
"@angular/common": "~9.1.6",
"@angular/core": "~9.1.6",
"@angular/forms": "~9.1.6",
"@angular/platform-browser": "~9.1.6",
"@angular/platform-browser-dynamic": "~9.1.6",
"@angular/router": "~9.1.6",
"@auth0/angular-jwt": "^4.1.2",
"@capacitor/core": "3.0.0",
"@ionic-native/app-version": "^5.36.0",
"@ionic-native/core": "^5.36.0",
"@ionic-native/device": "^5.36.0",
"@ionic-native/in-app-browser": "^5.36.0",
"@ionic-native/ionic-webview": "^5.36.0",
"@ionic-native/local-notifications": "^5.36.0",
"@ionic-native/native-audio": "^5.36.0",
"@ionic-native/network": "^5.36.0",
"@ionic-native/screen-orientation": "^5.36.0",
"@ionic-native/splash-screen": "^5.36.0",
"@ionic-native/status-bar": "^5.36.0",
"@ionic/angular": "^5.0.0",
"@ionic/storage": "^2.3.1",
"@types/google-maps": "^3.2.2",
"@types/hammerjs": "^2.0.39",
"compare-func": "^2.0.0",
"cordova-android": "^9.0.0",
"cordova-ios": "^5.1.1",
"cordova-plugin-androidx": "^2.0.0",
"cordova-plugin-androidx-adapter": "^1.1.1",
"cordova-plugin-app-version": "^0.1.9",
"cordova-plugin-badge": "^0.8.8",
"cordova-plugin-device-name": "^1.3.5",
"cordova-plugin-fcm-with-dependecy-updated": "^7.3.1",
"cordova-plugin-inappbrowser": "^4.1.0",
"cordova-plugin-ionic-webview": "^5.0.0",
"cordova-plugin-local-notification": "^0.9.0-beta.2",
"cordova-plugin-nativeaudio": "^3.0.9",
"cordova-plugin-network-information": "^2.0.2",
"cordova-plugin-screen-orientation": "^3.0.2",
"cordova-plugin-wkwebviewxhrfix": "git+https://github.com/TheMattRay/cordova-plugin-wkwebviewxhrfix.git",
"cordova-support-google-services": "^1.3.2",
"es6-promise-plugin": "^4.2.2",
"hammerjs": "^2.0.8",
"ionic-pullup": "^5.0.0-beta.3",
"ionic2-calendar": "^0.6.9",
"phonegap-plugin-multidex": "^1.0.0",
"rxjs": "~6.5.1",
"rxjs-compat": "^6.5.5",
"tslib": "^1.10.0",
"zone.js": "~0.10.2"
},
M<环境看起来像:
Ionic:
Ionic CLI : 5.4.16 (/usr/local/lib/node_modules/ionic)
Ionic Framework : @ionic/angular 5.9.1
@angular-devkit/build-angular : 0.901.15
@angular-devkit/schematics : 9.1.15
@angular/cli : 9.1.15
@ionic/angular-toolkit : 2.3.3
Cordova:
Cordova CLI : 9.0.0 (cordova-lib@9.0.1)
Cordova Platforms : android 8.1.0, ios 5.1.1
Cordova Plugins : cordova-plugin-ionic-keyboard 2.2.0, cordova-plugin-ionic-webview 5.0.0, (and 18 other plugins)
我错过了什么吗?欢迎任何帮助!
按照以下步骤操作后一切正常:
- 重命名文件夹 node_modules、www 和 platforms/android(出于备份原因)
- npm 安装
- ionic cordova 准备 android
- ionic cordova 运行 android --prod
我目前在使用 Ionic 5 和 Angular 9 项目时遇到问题。
ionic cordova run android
效果很好
但是我 运行 ionic cordova run android --prod
我唯一得到的就是空白屏幕。
chrome 开发工具的输出:
Error: Angular JIT compilation failed: '@angular/compiler' not loaded!
- JIT compilation is discouraged for production use-cases! Consider AOT mode instead.
- Did you bootstrap using '@angular/platform-browser-dynamic' or '@angular/platform-server'?
- Alternatively provide the compiler with 'import "@angular/compiler";' before bootstrapping.
at J (main-es2015.a75ef42b05ed5a68eecb.js:1)
at Function.get (main-es2015.a75ef42b05ed5a68eecb.js:1)
at Gt (main-es2015.a75ef42b05ed5a68eecb.js:1)
at Ji (main-es2015.a75ef42b05ed5a68eecb.js:1)
at main-es2015.a75ef42b05ed5a68eecb.js:1
at Yi.processProvider (main-es2015.a75ef42b05ed5a68eecb.js:1)
at main-es2015.a75ef42b05ed5a68eecb.js:1
at main-es2015.a75ef42b05ed5a68eecb.js:1
at Array.forEach (<anonymous>)
at Ot (main-es2015.a75ef42b05ed5a68eecb.js:1)
我已经检查了以下解决方法,但是 none 对我的项目有效:
- Angular JIT compilation failed: '@angular/compiler' not loaded
如果我在 angular.js 中将 aot 和 buildOptimizer 设置为 false,我可以 运行 ionic cordova run android --prod
而不会出现任何错误,但是当我尝试使用 ionic cordova build android --prod --release
生成 apk 时再打开,又是一片空白
我目前在 package.json 中的依赖项是:
"dependencies": {
"@angular/common": "~9.1.6",
"@angular/core": "~9.1.6",
"@angular/forms": "~9.1.6",
"@angular/platform-browser": "~9.1.6",
"@angular/platform-browser-dynamic": "~9.1.6",
"@angular/router": "~9.1.6",
"@auth0/angular-jwt": "^4.1.2",
"@capacitor/core": "3.0.0",
"@ionic-native/app-version": "^5.36.0",
"@ionic-native/core": "^5.36.0",
"@ionic-native/device": "^5.36.0",
"@ionic-native/in-app-browser": "^5.36.0",
"@ionic-native/ionic-webview": "^5.36.0",
"@ionic-native/local-notifications": "^5.36.0",
"@ionic-native/native-audio": "^5.36.0",
"@ionic-native/network": "^5.36.0",
"@ionic-native/screen-orientation": "^5.36.0",
"@ionic-native/splash-screen": "^5.36.0",
"@ionic-native/status-bar": "^5.36.0",
"@ionic/angular": "^5.0.0",
"@ionic/storage": "^2.3.1",
"@types/google-maps": "^3.2.2",
"@types/hammerjs": "^2.0.39",
"compare-func": "^2.0.0",
"cordova-android": "^9.0.0",
"cordova-ios": "^5.1.1",
"cordova-plugin-androidx": "^2.0.0",
"cordova-plugin-androidx-adapter": "^1.1.1",
"cordova-plugin-app-version": "^0.1.9",
"cordova-plugin-badge": "^0.8.8",
"cordova-plugin-device-name": "^1.3.5",
"cordova-plugin-fcm-with-dependecy-updated": "^7.3.1",
"cordova-plugin-inappbrowser": "^4.1.0",
"cordova-plugin-ionic-webview": "^5.0.0",
"cordova-plugin-local-notification": "^0.9.0-beta.2",
"cordova-plugin-nativeaudio": "^3.0.9",
"cordova-plugin-network-information": "^2.0.2",
"cordova-plugin-screen-orientation": "^3.0.2",
"cordova-plugin-wkwebviewxhrfix": "git+https://github.com/TheMattRay/cordova-plugin-wkwebviewxhrfix.git",
"cordova-support-google-services": "^1.3.2",
"es6-promise-plugin": "^4.2.2",
"hammerjs": "^2.0.8",
"ionic-pullup": "^5.0.0-beta.3",
"ionic2-calendar": "^0.6.9",
"phonegap-plugin-multidex": "^1.0.0",
"rxjs": "~6.5.1",
"rxjs-compat": "^6.5.5",
"tslib": "^1.10.0",
"zone.js": "~0.10.2"
},
M<环境看起来像:
Ionic:
Ionic CLI : 5.4.16 (/usr/local/lib/node_modules/ionic)
Ionic Framework : @ionic/angular 5.9.1
@angular-devkit/build-angular : 0.901.15
@angular-devkit/schematics : 9.1.15
@angular/cli : 9.1.15
@ionic/angular-toolkit : 2.3.3
Cordova:
Cordova CLI : 9.0.0 (cordova-lib@9.0.1)
Cordova Platforms : android 8.1.0, ios 5.1.1
Cordova Plugins : cordova-plugin-ionic-keyboard 2.2.0, cordova-plugin-ionic-webview 5.0.0, (and 18 other plugins)
我错过了什么吗?欢迎任何帮助!
按照以下步骤操作后一切正常:
- 重命名文件夹 node_modules、www 和 platforms/android(出于备份原因)
- npm 安装
- ionic cordova 准备 android
- ionic cordova 运行 android --prod