html-validate更适合现代html校验，因其支持自定义规则和json输出；html-minifier-cli压缩需避坑内联脚本；rsync配合软链实现原子部署；npm scripts串联需严格校验退出码与失败反馈。
直接用 npm scripts 串联 HTML 校验、压缩与部署是可行的，但关键在于每一步的工具选型、参数配置和错误兜底——漏掉任一环节，自动化就会在 CI/CD 中静默失败。
HTML 校验该用哪个命令？html-validate 比 tidy 更适合现代工程
校验不是“有没有错”，而是“是否符合团队规范”。html-validate 支持自定义规则集（如 WCAG、Airbnb HTML 规范），且能输出 JSON 格式供后续流程消费；tidy 只做基础语法修复，不支持规则扩展。
- 安装：
npm install --save-dev html-validate - 配置：
.htmlvalidate.json中指定"extends": ["html-validate:recommended"]，可叠加"rules": {"attr-value-quotes": "error"} - 校验命令写成：
"validate:html": "html-validate src/*.html --output-format json --output-file .htmlvalidate-report.json" - 注意：默认不中断执行，需加
--fail-on-warnings或在 CI 中用jq解析.htmlvalidate-report.json判断errorCount > 0
html-minifier-cli 压缩 HTML 的坑：空格合并和注释删除会破坏某些内联脚本
压缩不是越狠越好。html-minifier-cli 默认启用 --collapse-whitespace 和 --remove-comments，但若 HTML 中有内联 <script></script> 依赖换行或注释分隔（比如老式模板字符串拼接），压缩后可能报语法错误。
- 安全压缩建议组合：
"minify:html": "html-minifier-cli --collapse-whitespace --remove-comments --minify-css true --minify-js true --ignore-custom-comments '/^!/' --input-dir src --output-dir dist" -
--ignore-custom-comments '/^!/'保留以<!--! ... -->开头的注释（常用于构建时占位） - 若项目含 Vue / Svelte 模板语法，必须加
--ignore-custom-fragments ''避免误删 - 验证方式：压缩后手动打开
dist/index.html，检查内联 JS 是否仍可执行，而非只看文件体积
部署脚本不能只写 scp：得处理权限、路径不存在和原子性
scp -r dist/ user@host:/var/www/html 看似简单，但线上目录权限不对会失败，/var/www/html 不存在会静默创建空目录，且覆盖过程非原子——用户可能看到半截页面。
- 推荐用
rsync替代："deploy": "rsync -avz --delete --exclude='.git' dist/ user@host:/var/www/html/" - 加
--delete清理旧文件，但先确认远程目录无其他必要文件 - 为防路径问题，部署前加健康检查：
"deploy:check": "ssh user@host 'mkdir -p /var/www/html && chmod 755 /var/www/html'" - 真正原子部署应配合软链切换：
ssh user@host 'cd /var/www && rm -f current && ln -sf html-v20260701 current'，再让 Nginx 指向/var/www/current
如何让校验 → 压缩 → 部署串起来又不互相阻断？
用 && 连接命令看似顺滑，但中间某步失败时，后续步骤不会执行——这反而是好事；真正危险的是“成功假象”：比如校验失败但因没设 --fail-on-warnings 而继续压缩，最终部署了不合格 HTML。
- 组合脚本示例：
"ci:build": "npm run validate:html && npm run minify:html && npm run deploy" - CI 环境中必须加
--no-progress和--silent参数减少日志噪音，否则 GitHub Actions 可能因超时中断 - 本地开发用
"dev:build": "npm run validate:html || exit 1; npm run minify:html"，确保校验失败立即终止 - 别忽略退出码：所有工具都应返回非零码表示失败，
html-minifier-cli在输入为空时返回 0，需额外判断ls dist/*.html | wc -l是否为 0
自动化真正的难点不在命令拼接，而在每个环节的失败反馈是否明确、恢复路径是否清晰——比如部署失败后，你得知道是密钥过期、磁盘满，还是 HTML 本身被压缩坏了。把这些判断埋进脚本里，比多写十个 npm run 都管用。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
