You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

Angular10配置@ng-toolkit/universal实现SSR时报错:需传入引导的NgModule

报错原因

核心问题是依赖版本不匹配、服务端模块加载逻辑不兼容:

  • 你使用的@ng-toolkit/universal@7.1.0是针对Angular 7开发的第三方工具,已经停止多年更新,即使你降级了@schematics/angular绕开了安装限制,它生成的服务端配置、模块加载逻辑也适配不了Angular 10的Ivy编译机制。
  • 你的package.json中@nguniversal/common、@nguniversal/module-map-ngfactory-loader版本为无效的0.0.0,相当于没有正确安装SSR必需的核心依赖,服务端渲染时无法定位到需要引导的启动模块。
  • 项目的服务启动文件local.js大概率还是沿用旧版Angular Universal的逻辑加载NgModuleFactory,但Angular 9+默认开启Ivy编译后已经不需要NgFactory文件,加载逻辑失效导致传入的引导模块为undefined,就会抛出你遇到的报错。
修复方案

优先推荐官方方案,兼容性和稳定性更有保障:

方案一:移除第三方工具,使用Angular官方SSR方案(推荐)

  • 第一步:卸载不兼容的冗余依赖
npm uninstall @ng-toolkit/universal @nguniversal/common @nguniversal/module-map-ngfactory-loader
  • 第二步:安装适配Angular 10的官方SSR依赖
ng add @nguniversal/express-engine@10.1.0

该命令会自动生成符合Angular 10规范的服务端入口、Express引擎配置、构建脚本,不需要手动调整webpack配置,完全适配Ivy编译机制。

  • 第三步:使用官方生成的脚本执行构建和启动即可,默认构建命令为npm run build:ssr,启动命令为npm run serve:ssr。

方案二:强制兼容@ng-toolkit/universal的修改方式

如果必须保留当前工具链,可按以下步骤调整:

  • 第一步:安装正确版本的SSR核心依赖
npm install @nguniversal/common@10.1.0 @nguniversal/module-map-ngfactory-loader@8.2.6
  • 第二步:修改服务启动文件local.js的模块加载逻辑
    如果开启了Ivy编译,将原来加载AppServerModuleNgFactory的代码,改为直接加载AppServerModule:
// 旧代码(大概率是这样)
const { AppServerModuleNgFactory, LAZY_MODULE_MAP } = require('./dist/server/main');
// 替换为
const { AppServerModule } = require('./dist/server/main');

同时找到Express引擎配置的位置,将传入的引导模块替换为AppServerModule即可。如果关闭Ivy编译,需要在tsconfig.server.json中添加配置"enableIvy": false,重新构建后即可正常运行。

内容的提问来源于stack exchange,提问作者Rithicka

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.10.04 14:57:03