Angular编译过程中会移除TypeScript或HTML注释吗？是否支持配置？

默认行为 #

• TypeScript 代码：ng serve 默认会移除 TypeScript 编译后的 JavaScript 代码里的绝大多数注释。只有带有 /*@preserve ... */ 或 /*@license ... */ 标记的多行注释会被保留，其他单行、普通多行注释都会被清理掉。
• HTML 模板：默认情况下，HTML 文件里的注释会原封不动保留，不管是开发还是生产构建，除非你手动开启特定优化选项。

自定义配置方法 #

调整 TypeScript 注释规则 #

修改项目根目录的 tsconfig.json 文件，在 compilerOptions 里配置 removeComments 字段：

• 设置为 true（默认值）：移除除了带 @preserve/@license 标记外的所有注释
• 设置为 false：保留所有 TypeScript 注释

示例配置：

{
  "compilerOptions": {
    "removeComments": false
  }
}

修改后重启 ng serve 生效。

移除 HTML 模板中的注释 #

要清理 HTML 注释，需要在 angular.json 中开启优化选项，该配置在生产构建时默认可选，也可强制在开发模式启用：

1. 打开 angular.json，找到对应项目的 architect -> build -> configurations 节点
2. 在目标配置（比如 production 或 development）里添加 optimization.html.removeComments：

示例生产模式配置：

{
  "projects": {
    "your-project-name": {
      "architect": {
        "build": {
          "configurations": {
            "production": {
              "optimization": {
                "html": {
                  "removeComments": true
                }
              }
            }
          }
        }
      }
    }
  }
}

如果想在 ng serve 时也移除 HTML 注释，只需在 development 配置块中添加相同的 optimization 设置即可，但这可能会影响调试时查看模板结构。

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