基于Git提交规范的HTML代码质量自动化核准-html教程-PHP中文网

CI拒绝不匹配conventional-commits的提交，须在pre-commit阶段用husky+commitlint拦截；html-validate需精准定位违规行、仅扫描变更HTML文件，并配置customElement适配团队自定义组件。

基于git提交规范的html代码质量自动化核准

提交信息不匹配`conventional-commits`规范时，CI直接拒绝合并

Git提交信息不是装饰，而是自动化流程的触发开关。CI脚本必须在git commit后立即校验，不能等到git push才报错——否则开发者已切分支、写新代码，回退成本陡增。

用husky + commitlint在pre-commit钩子阶段拦截：安装后确保.husky/pre-commit里有npx commitlint --edit $1，且commitlint.config.js启用@commitlint/config-conventional
CI（如GitHub Actions）中加一步：npm run commitlint -- --from=$(git merge-base origin/main HEAD)，避免校验历史全部提交，只查本次引入的
常见误配：把type写成feat:（带冒号），实际应为feat；或scope用了空格而非括号包裹，如feat(html parser) ✅，feat(html parser) ❌（注意括号是英文半角）

`html-validate`扫描结果未嵌入PR评论，开发者看不见具体哪行违规

仅跑出html-validate报告但不关联到代码行，等于没做。关键不是“有没有检查”，而是“问题能不能准确定位到

这行”。
GitHub Actions中必须启用reporters: ["github-pr-check"]，并配置GITHUB_TOKEN权限为contents: write和pull-requests: write

本地调试时，先用npx html-validate --format=checkstyle src/*.html > report.xml生成标准格式，再用html-validate-action插件解析——别直接依赖console输出，它无法被CI提取行号
注意html-validate默认不校验.vue或.jsx里的模板，需显式加--ext .html,.vue，否则块全被跳过

CI里git diff范围选错，导致未修改的HTML文件也被扫描
自动化核准必须聚焦变更，否则每次PR扫全量src/下几百个HTML，既慢又掩盖真实问题。核心是精准提取本次提交新增/修改的HTML路径。

用git diff --name-only origin/main...HEAD -- '*.html'（三个点），不是两个点——双点origin/main..HEAD只比对当前分支最新提交，三点才获取合并基础范围，适配多提交PR
过滤空结果：加| grep -v '^$'，避免html-validate收到空参数报no files matched错误而中断流程
路径含空格？用xargs -r -d '\n'代替xargs -r，否则src/components/my card.html会被截断成src/components/my


自定义规则与团队HTML组件库冲突，核准结果反复漂移
团队封装了组件，但html-validate默认规则要求button必须有type属性——而组件内部已固化type="button"，外部调用不该重复声明。硬套通用规则只会制造噪音。

											
												
												
													从 Git 仓库历史中彻底删除文件
													|Git删除了文件，但还会在Git 仓库历史中遗留。 - 想要从 Git 历史移除敏感信息（密码、密钥、token、私钥） - 想要删除意外提交的大文件 - 想要重写 Git 历史、移除特定文件的所有痕迹 - 提到 "force push"、"重写 commit 历史" - 需要从所有分支、所有 tag 中删除某个文件
												
												下载
												
											
										

在.htmlvalidate.json里用"rules": {"require-type-attr": ["off", {"ignoreTags": ["ui-button", "ui-input"]}]}关闭特定标签校验
更彻底的做法：用html-validate的customElement配置，把ui-*前缀注册为自定义元素，使其绕过原生HTML语义校验
注意：规则关闭必须写进项目级配置，不能只放package.json里——某些CI环境不读package.json中的html-validate字段

真正卡住落地的，往往不是工具链搭不起来，而是git diff范围算错导致漏检、或是自定义组件没在html-validate里声明为合法元素——这两处不调通，自动化就只是个会报错的摆设。