Angular 20 仅使用SSG场景下生产构建意外引入debug_node模块的优化问题

我完全懂你这种困扰——本来只想用Angular的SSG预渲染功能做静态部署，结果生产构建里居然混进来一大块带debug字样的模块，占了快60%的初始chunk，而且还是来自根本用不上的server端依赖链，太闹心了！

问题根源分析 #

你提到即使把ssr设为false，这个debug_node-DTOmNMDH.mjs还是存在，核心原因是：最初用--ssr创建的项目，残留了不少server端的配置和文件关联，哪怕你关掉SSR开关，Angular的构建器还是会保留这些依赖痕迹，导致Webpack无法彻底摇掉这部分死代码。这个debug模块本来是Angular SSR调试用的，正常纯SSG/静态构建完全不需要加载它。

具体解决步骤 #

1. 彻底清理Server端相关文件与配置

这是最关键的一步，把项目里所有SSR专属的内容清干净：

• 删除src/main.server.ts、src/app/app.server.module.ts这两个核心server端文件（如果还有其他server相关的服务/模块也一并删除）；
• 打开angular.json，完全移除build配置里的server字段（就是你之前写的"server": "src/main.server.ts"），同时检查整个architect节点，确保没有server相关的构建目标；
• 检查tsconfig.json和tsconfig.app.json，如果有针对server端的路径映射、编译选项，也全部删除。

2. 强化生产构建的优化配置

在angular.json的production配置里，明确添加优化参数，强制开启死代码消除：

"configurations": {
  "production": {
    "outputHashing": "all",
    "sourceMap": false,
    "optimization": true,
    "buildOptimizer": true,
    "aot": true,
    "budgets": [
      {
        "type": "initial",
        "maximumWarning": "50kb",
        "maximumError": "100kb"
      }
    ]
  }
}

这里重点强调aot和buildOptimizer必须设为true——这两个是Angular生产构建中消除死代码的核心开关，能帮Webpack精准识别并移除无用的依赖模块。

3. 清理缓存后重新构建

残留的依赖缓存可能会影响构建结果，按以下步骤操作：

• 删除node_modules、dist文件夹；
• 运行npm install重新安装依赖；
• 再执行ng build --configuration=production --stats-json，之后用Bundle Analyzer检查，应该就能看到debug_node模块已经消失了。

4. 确认SSG模式的正确配置

确保build.options里的outputMode严格设为static，这个参数会告诉Angular构建器只生成纯静态HTML/CSS/JS，完全不需要任何server端运行时支持：

"options": {
  "outputMode": "static",
  "ssr": false
}

验证结果 #

完成以上步骤后，重新生成的stats.json里，初始chunk的大小应该会大幅下降，那个占比57%的debug模块也会被彻底移除——毕竟它本来就是完全用不上的死代码，只是之前的配置残留让构建器误以为需要保留它。

内容来源于stack exchange