angular - 将 Ionic 和 Angular 更新到最新版本后，在移动设备测试中出现黑屏

Question

我正在重新开始一个我已经工作了 2 年的项目，并且在几乎半年没有触及它之后，我将 Angular 和 Ionic 都更新到了最新版本（至于今天）。

这些迁移很简单，几乎不费吹灰之力，并且该应用程序可以在桌面上完美运行。到目前为止，没有任何错误或问题。

当我在手机上进行测试时，情况会有所不同：屏幕变白，没有其他反应。当我使用 Chrome Inspector（激活 USB 调试）对其进行分析时，我看到以下错误堆栈：

onscript loading complete
capacitor-runtime.js:361 TypeError: fn.bind is not a function
    at newTrustedFunctionForJIT (/vendor-es2015.js:10868)
    at JitEvaluator.evaluateCode (/vendor-es2015.js:10932)
    at JitEvaluator.evaluateStatements (/vendor-es2015.js:10906)
    at CompilerFacadeImpl.jitExpression (/vendor-es2015.js:24300)
    at CompilerFacadeImpl.compileNgModule (/vendor-es2015.js:24230)
    at Function.get (/vendor-es2015.js:116292)
    at getNgModuleDef (/vendor-es2015.js:90418)
    at assertNgModuleType (/vendor-es2015.js:90597)
    at compileNgModuleFactory__POST_R3__ (/vendor-es2015.js:118326)
    at PlatformRef.bootstrapModule (/vendor-es2015.js:118573)
capacitor.handleError @ capacitor-runtime.js:361
/vendor-es2015.js:10868 Uncaught TypeError: fn.bind is not a function
    at newTrustedFunctionForJIT (/vendor-es2015.js:10868)
    at JitEvaluator.evaluateCode (/vendor-es2015.js:10932)
    at JitEvaluator.evaluateStatements (/vendor-es2015.js:10906)
    at CompilerFacadeImpl.jitExpression (/vendor-es2015.js:24300)
    at CompilerFacadeImpl.compileNgModule (/vendor-es2015.js:24230)
    at Function.get (/vendor-es2015.js:116292)
    at getNgModuleDef (/vendor-es2015.js:90418)
    at assertNgModuleType (/vendor-es2015.js:90597)
    at compileNgModuleFactory__POST_R3__ (/vendor-es2015.js:118326)
    at PlatformRef.bootstrapModule (/vendor-es2015.js:118573)
/vendor-es2015.js:67688 Ionic Native: deviceready event fired after 60 ms
DevTools failed to load SourceMap: Could not load content for http://localhost/runtime-es2015.js.map: Connection error: net::ERR_CONNECTION_REFUSED
DevTools failed to load SourceMap: Could not load content for http://localhost/main-es2015.js.map: Connection error: net::ERR_CONNECTION_REFUSED
DevTools failed to load SourceMap: Could not load content for http://localhost/polyfills-es2015.js.map: Connection error: net::ERR_CONNECTION_REFUSED
DevTools failed to load SourceMap: Could not load content for http://localhost/vendor-es2015.js.map: Connection error: net::ERR_CONNECTION_REFUSED

我目前正在使用 Capacitor 而不是 Cordova，这些是我的依赖项：

 "dependencies": {
    "@agm/core": "^1.1.0",
    "@angular/common": "~11.2.0",
    "@angular/core": "~11.2.0",
    "@angular/forms": "~11.2.0",
    "@angular/platform-browser": "~11.2.0",
    "@angular/platform-browser-dynamic": "~11.2.0",
    "@angular/router": "~11.2.0",
    "@capacitor/android": "^2.2.0",
    "@capacitor/core": "^2.2.0",
    "@capacitor/ios": "^2.2.0",
    "@ionic-native/camera": "^5.28.0",
    "@ionic-native/core": "^5.0.7",
    "@ionic-native/crop": "^5.28.0",
    "@ionic-native/file": "^5.28.0",
    "@ionic-native/geolocation": "^5.26.0",
    "@ionic-native/image-picker": "^5.28.0",
    "@ionic-native/splash-screen": "^5.0.0",
    "@ionic-native/status-bar": "^5.0.0",
    "@ionic/angular": "^5.5.4",
    "@types/googlemaps": "^3.39.7",
    "@types/parse": "^2.12.1",
    "angularx-social-login": "^3.2.2",
    "cordova-android": "^8.1.0",
    "cordova-plugin-camera": "^4.1.0",
    "cordova-plugin-crop": "^0.4.0",
    "cordova-plugin-file": "^6.0.2",
    "cordova-plugin-geolocation": "^4.0.2",
    "cordova-plugin-telerik-imagepicker": "^2.3.5",
    "jetifier": "^1.6.6",
    "moment": "^2.26.0",
    "parse": "^2.13.0",
    "rxjs": "~6.5.1",
    "tslib": "^2.0.0",
    "zone.js": "~0.10.2"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "~0.1101.4",
    "@angular/cli": "~11.1.4",
    "@angular/compiler": "~11.2.0",
    "@angular/compiler-cli": "~11.2.0",
    "@angular/language-service": "~11.2.0",
    "@capacitor/cli": "^2.2.0",
    "@ionic/angular-toolkit": "^2.1.1",
    "@types/jasmine": "~3.6.0",
    "@types/jasminewd2": "~2.0.3",
    "@types/node": "^12.11.1",
    "codelyzer": "^6.0.0",
    "jasmine-core": "~3.6.0",
    "jasmine-spec-reporter": "~5.0.0",
    "karma": "~5.0.0",
    "karma-chrome-launcher": "~3.1.0",
    "karma-coverage-istanbul-reporter": "~3.0.2",
    "karma-jasmine": "~4.0.0",
    "karma-jasmine-html-reporter": "^1.5.0",
    "protractor": "~7.0.0",
    "ts-node": "~8.3.0",
    "tslint": "~6.1.0",
    "typescript": "~4.1.5"
  },

附加数据：

OS: Windows 10
Node: v15.7.0
Device: Xiaomi Pocophone F2

是什么导致了这个问题？

标签： angularionic-frameworkcapacitor