Angular 18项目开启prerender后构建卡在chunk阶段求助

问题描述 #

Angular 18项目配置SSR后运行正常，但将project.json中的prerender设为true时，构建会卡在chunk阶段；设为false则能正常完成构建。添加--verbose参数也无法获取更多报错信息。

相关配置片段：

{
  "build": {
      "executor": "@angular-devkit/build-angular:application",
      "outputs": ["{options.outputPath}"],
      "options": {
        "outputPath": "dist/web-app",
        "index": "./src/index.html",
        "browser": "./src/main.ts",
        "polyfills": ["zone.js"],
        "tsConfig": "tsconfig.app.json",
        "inlineStyleLanguage": "scss",
        "assets": [
          {
            "glob": "**/*",
            "input": "assets",
            "output": "/assets"
          }
        ],
        "styles": ["./src/styles.scss"],
        "scripts": [],
        "server": "./src/main.server.ts",
        "prerender": true, // 问题触发选项
        "ssr": {
          "entry": "./server.ts"
        }
      }
  }
}

已反复切换prerender的true/false值，确认问题仅在该选项为true时出现。

排查与解决建议 #

• 检查路由配置：确保所有路由都是静态可预渲染的，避免未处理的动态路由参数；同时检查路由守卫中是否存在未正确resolve的异步操作（比如无限等待的Promise），这会导致预渲染进程卡住。
• 排查异步逻辑：检查组件的生命周期钩子（如ngOnInit）、服务中的异步代码，以及main.server.ts、server.ts中的服务器端逻辑，确保所有异步操作都能正常完成，没有无限挂起的情况。
• 逐步定位问题页面：暂时注释掉部分页面组件的路由配置，重新构建，逐步排查是哪个页面的预渲染导致了卡住。
• 升级构建工具：尝试升级@angular-devkit/build-angular到最新版本，命令：

  npm update @angular-devkit/build-angular
  

  部分版本的构建工具存在预渲染相关的bug，升级后可能解决问题。
• 验证资源路径：确认assets和静态资源的路径配置正确，预渲染时若资源加载失败或路径错误，也可能导致构建进程卡住。

内容的提问来源于stack exchange，提问作者Hassan Ghasemi