html注释会泄露敏感信息是因为其不执行但会被浏览器完整暴露在源码中，git提交、构建或ci/cd未清理时易将密钥等推至公网；应使用html-minifier-terser在构建阶段自动剥离注释，并在ci/cd中用ripgrep扫描兜底，同时规范开发阶段注释习惯。
为什么 HTML 注释会成为敏感信息泄露的入口
HTML 注释本身不执行，但会被浏览器完整下载并暴露在源码中——git commit 时没清理、webpack 构建未过滤、甚至 CI/CD 流水线直接发布带注释的生产包，都可能把 TODO: 密钥待替换、<!-- DEBUG: api_key=xxx --> 这类内容推到公网。不是“会不会泄露”，而是“什么时候被发现”。
用 html-minifier-terser 在构建阶段自动剥离注释
这是最稳妥的工程化拦截点：在打包输出前统一处理，不依赖人工检查。注意别用已停更的 html-minifier，改用维护活跃的 html-minifier-terser。
- 安装：
npm install --save-dev html-minifier-terser - 配置关键项：
removeComments: true（移除所有注释），removeConditionalComments: true（清除 IE 条件注释） - 若需保留部分注释（如 license 声明），用
removeCommentsFromCDATA: false+ 正则白名单控制，但生产环境建议全删 - Webpack 用户注意：
html-webpack-plugin的minify选项传入该配置，而非用它内置的过期 minifier
CI/CD 中加一道静态扫描防线
构建阶段清理是主动防御，CI 阶段扫描是兜底验证——防止本地误跳过构建、或非标准流程直传 HTML 文件。
- 用
grep -r "(<!--.*?-->)" ./dist/简单粗筛，但容易漏多行注释；更可靠的是ripgrep：rg -t html -e "<!--.*?-->" --multiline --multiline-dotall ./dist/ - 匹配到结果就
exit 1，阻断发布。注意排除node_modules和第三方资源目录 - 若团队习惯用
TODO/FIXME注释，可额外加规则：rg -i "(TODO|FIXME|DEBUG|PASSWORD|API_KEY)" ./src/，但这类应进代码扫描而非 HTML 扫描
开发阶段如何避免写敏感注释
工具能清掉注释，但不能阻止人写。真正难防的是开发者在模板里随手记的调试线索。
- 禁止在
.html或.vue/.jsx模板中写含敏感词的注释，比如api_key、password、内网地址 - 调试信息统一走
console.log或专用调试组件，HTML 模板只负责结构渲染 - 编辑器可配
eslint-plugin-html+ 自定义规则，检测<!--.*?(key|pwd|secret).*?-->并报错
注释清理本身很简单，麻烦的是跨角色协作——前端发版、运维部署、安全审计各自看到的 HTML 可能不同版本。确保构建产物、CDN 缓存、S3 存储桶里的文件都来自同一份 clean 后的输出，比写一百行正则还重要。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
