我正在将现有的 Angular v16 模块联合应用程序迁移到 Angular v18 和基于
esbuild
的本机联合插件。该应用程序在 shell 应用程序内托管了十几个微前端。
我已经更新了主机应用程序并运行本机联合,并且我在第一个微前端中进行了基本更改,以将其作为 shell 内的远程加载。但是,当我尝试在 shell 内启动加载该 MFE 时,我收到共享库的
404
错误(例如 angular core
和 angular common
),因为异步/等待请求无法找到它们。
为什么基础库不共享?
我正在使用普通模板通过
federation.manifest.json
文件共享 MFE。
const { withNativeFederation, shareAll } = require('@angular-architects/native-federation/config');
module.exports = withNativeFederation({
name: 'managerFrontend',
exposes: {
'./Component': './src/app/manager/manager.component.ts'
},
shared: {
...shareAll({ singleton: true, strictVersion: true, requiredVersion: 'auto' }),
},
skip: [
'rxjs/ajax',
'rxjs/fetch',
'rxjs/testing',
'rxjs/webSocket'
]
});
这里似乎需要精确的版本。
我能够通过使用最新版本的插件并精确匹配 Angular 库的版本来修复此问题。
Native Federation 插件的原始 v18 版本似乎也存在一个错误,v18.2.2 已修复该错误。
"dependencies": {
"@angular-architects/native-federation": "^18.2.2",
"@angular/animations": "18.2.7",
"@angular/common": "18.2.7",
"@angular/compiler": "18.2.7",
...