Angular8使用single-spa打包后访问懒加载模块报runtime compiler未加载

架构老林

2026-10-6

解决步骤

修正资源路径配置
打开angular.json，找到当前项目构建配置下的deployUrl字段，填写为该single-spa微应用的实际部署资源前缀路径。比如微应用所有打包产物部署在//your-domain.com/micro/security/下，就将deployUrl设为对应地址，确保懒加载chunk的请求路径正确。
如果你使用自定义webpack配置构建，在webpack配置中新增output.publicPath = '你的微应用资源部署前缀'即可。
验证ts编译配置
打开tsconfig.json，确认compilerOptions.module字段值为ESNext，保证动态导入语法的打包逻辑符合single-spa的要求。
检查路由导出逻辑
确认security.routing.module.ts文件末尾有如下导出代码：
```
@NgModule({
  imports: [RouterModule.forChild(routes)],
  exports: [RouterModule]
})
export class SecurityRoutingModule { }
```
确保路由规则不会在生产打包时被tree-shaking清理。
临时排查方案
可以在npm run build:single-spa命令后添加--aot=false参数打包测试，如果关闭AOT后报错消失，说明Security模块下存在未正确声明的组件/依赖，逐个检查SecurityModule的declarations、imports配置项补全遗漏内容即可。