Angular 18+Native Federation环境下NG0203错误解决求助
Angular v18.2.4 + Native Federation 18.2.2 微前端加载冻结问题
已将宿主及微前端应用升级至Angular v18.2.4和Native Federation 18.2.2。宿主可正常加载,但尝试加载其他MFE时,应用完全冻结,疑似Angular版本冲突导致。
首次升级时,曾借助Manfred Steyer的18.2更新解决过同类问题,当时以为已彻底修复,且正常运行了一段时间。如今问题复现,仍像是版本不匹配引发的——是Angular或相关库更新导致的吗?还是存在其他问题?
我的依赖结构较为基础,以下是宿主的依赖配置:
"dependencies": { "@angular-architects/native-federation": "^18.2.2", "@angular-eslint/schematics": "^18.3.1", "@angular/animations": "^18.2.4", "@angular/common": "^18.2.4", "@angular/compiler": "^18.2.4", "@angular/core": "^18.2.4", "@angular/forms": "^18.2.4", "@angular/platform-browser": "^18.2.4", "@angular/platform-browser-dynamic": "^18.2.4", "@angular/router": "^18.2.4", "es-module-shims": "^1.5.12", "lazy-line-painter": "1.9.6", "rxjs": "~6.6.0", "tslib": "^2.3.0", "umbrella-library": "^2.1.1", "windowed-observable": "^1.0.0", "zone.js": "~0.14.10" }, "devDependencies": { "@angular-devkit/build-angular": "^18.2.4", "@angular-devkit/core": "^18.2.4", "@angular/cli": "^18.2.4", "@angular/compiler-cli": "^18.2.4", "@schematics/angular": "^18.2.4", "@types/jasmine": "~3.8.0", "@types/node": "^12.11.1", "@typescript-eslint/eslint-plugin": "^6.10.0", "@typescript-eslint/parser": "^6.10.0", "eslint": "^8.53.0", "jasmine-core": "~3.8.0", "js-beautify": "=1.10.2", "karma": "~6.3.0", "karma-chrome-launcher": "~3.1.0", "karma-coverage": "~2.0.3", "karma-jasmine": "~4.0.0", "karma-jasmine-html-reporter": "~1.7.0", "prettier": "^2.6.2", "typescript": "^5.4.5" }
以下是MFE的依赖配置:
"dependencies": { "@angular-architects/native-federation": "^18.2.2", "@angular/animations": "^18.2.4", "@angular/cdk": "^18.2.4", "@angular/common": "^18.2.4", "@angular/compiler": "^18.2.4", "@angular/core": "^18.2.4", "@angular/forms": "^18.2.4", "@angular/platform-browser": "^18.2.4", "@angular/platform-browser-dynamic": "^18.2.4", "@angular/router": "^18.2.4", "angular-oauth2-oidc": "^16.0.0", "es-module-shims": "^1.5.12", "ng-zorro-antd": "^18.1.1", "rxjs": "~6.6.0", "tslib": "^2.3.0", "umbrella-library": "^2.1.1", "zone.js": "~0.14.10" }, "devDependencies": { "@angular-devkit/build-angular": "^18.2.4", "@angular/build": "^18.2.4", "@angular/cli": "^18.2.4", "@angular/compiler-cli": "^18.2.4", "@types/jasmine": "~3.8.0", "@types/node": "^12.11.1", "jasmine-core": "~3.8.0", "jasmine-spec-reporter": "~5.0.0", "js-beautify": "=1.10.2", "karma": "~6.3.0", "karma-chrome-launcher": "~3.1.0", "karma-coverage": "~2.0.3", "karma-jasmine": "~4.0.0", "karma-jasmine-html-reporter": "~1.7.0", "prettier": "^2.6.2", "typescript": "~5.4.5" }
宿主加载正常,但通过宿主UI导航尝试加载MFE时无任何反应,控制台报错如下:
ERROR w: NG0203 at Kv (https://fleet.dev.com/mf-fleet-reports/_angular_core.x-zcvsTSJQ.js:2:2812) at Module.ce (https://fleet.dev.com/mf-fleet-reports/_angular_core.x-zcvsTSJQ.js:2:2939) at Gt.ɵfac [as useFactory] (https://fleet.dev.com/mf-fleet-reports/_angular_cdk_a11y.jN-GTyy3AR.js:1:40053) at Object.o [as factory] (https://fleet.dev.com/_angular_core.HKJhf4bjIv.js:5:12521) at uo.hydrate (https://fleet.dev.com/_angular_core.HKJhf4bjIv.js:5:11667) at uo.get (https://fleet.dev.com/_angular_core.HKJhf4bjIv.js:5:10790) at zv (https://fleet.dev.com/_angular_core.HKJhf4bjIv.js:2:2862) at ae (https://fleet.dev.com/_angular_core.HKJhf4bjIv.js:2:2939) at useValue (https://fleet.dev.com/_angular_core.HKJhf4bjIv.js:5:8906) at uo.resolveInjectorInitializers (https://fleet.dev.com/_angular_core.HKJhf4bjIv.js:5:11167)
内容的提问来源于stack exchange,提问作者Tony Brasunas
相关产品推荐
相关产品推荐

