Angular 16升级后生产构建失败：document.documentElement.setAttribute不是函数

API 探路者

2026-7-16

解决Angular 16生产构建document.documentElement.setAttribute is not a function错误

以下是针对性的排查和解决步骤：

排查第三方依赖问题
你的代码里没调用这个方法，大概率是第三方依赖在构建优化阶段的DOM模拟环境中触发了该错误。可以通过逐步注释package.json中的非核心依赖，重新执行ng build --configuration=production来定位出问题的依赖。找到后，检查该依赖是否有Angular 16兼容的版本，或者查看其仓库是否有同类issue及修复方案。

调整构建优化的细粒度配置
不必完全关闭所有优化，可在angular.json的build配置中单独禁用HTML优化，保留脚本、样式的优化：

"configurations": {
  "production": {
    "optimization": {
      "scripts": true,
      "styles": true,
      "fonts": true,
      "html": false
    },
    // 其他生产配置...
  }
}

升级Angular CLI至同版本最新补丁
该错误可能是Angular 16某特定版本的CLI bug，执行以下命令升级到16.x分支的最新补丁版：
```
npm install @angular/cli@^16 --save-dev
```
检查index.html与自定义HTML处理逻辑
确认index.html中没有内嵌脚本在构建时被错误优化；如果使用了自定义的HTML处理器或修改了angular.json中的index路径配置，验证其正确性，避免构建时生成异常的DOM结构。
排查SSR/预渲染配置（若使用）
如果应用启用了Angular Universal（SSR）或预渲染，检查server.ts中使用的DOM模拟库（如jsdom）版本是否适配Angular 16，低版本的jsdom可能存在document.documentElement模拟不完整的问题，可尝试升级jsdom至最新兼容版本。
检查自定义Webpack配置（若使用）
若配置了自定义Webpack，确认HtmlWebpackPlugin或其他HTML处理插件的配置未与Angular CLI的默认构建逻辑冲突，避免篡改了构建过程中的DOM对象。