htmlhint 不支持数值型阈值配置,仅通过规则开关和严重度分级(error/warning/info)实现质量控制;所谓“阈值”实为人工选择启用规则及调整其级别,需配合 ci 脚本解析输出或自定义规则实现计数类检查。

HTMLHint 的阈值不是靠数字配置,而是靠规则开关
HTMLHint 本身不提供「错误数 ≤5」这类数值型质量门禁,它只做规则启用/禁用和严重度分级。所谓“定制阈值”,本质是选哪些规则开、哪些关,以及把 error 级规则降为 warning 或 info。
常见误操作是试图在 .htmlhintrc 里写 "max-errors": 3 —— 这个字段根本不存在,HTMLHint 不解析也不响应它。
- 真正起作用的只有
rules对象里的键值对,比如"attr-no-duplication": true - 每个规则默认严重度是
error,但可通过"attr-no-duplication": "warning"降级 - 想“阻断构建”,得靠 CI 工具(如 GitHub Actions)解析 HTMLHint 输出的 JSON 或 XML,再用脚本判断
error条目数是否为 0
如何让 HTMLHint 在 CI 中真正卡住不合规提交
本地跑 htmlhint src/*.html 只是提示,不会失败;要让它影响 CI 流水线,必须让命令返回非零退出码。
HTMLHint 默认在发现 error 时才返回 1,但如果你把所有规则都设成 warning,那它永远返回 0 —— 构建就永远不会被拦住。
将调研报告、方案对比、数据分析、需求梳理、会议纪要、设计说明、代码评审、学习笔记等任务产物输出为可在浏览器直接打开的单文件 HTML,替代 Markdown 作为最终交付物。Markdown 在信息密度、视觉清晰度和可分享性上已跟不上 AI 产物的丰富度,HTML 能同时承载排版、表格、SVG 等。
- 确保至少一个关键规则保持
true或"error",例如"tagname-lowercase"、"attr-no-duplication" - CI 脚本中加
--format=unix,输出格式含行号和错误类型,方便 grep 提取error: - 用 shell 判断:
htmlhint --format=unix src/*.html | grep -q "error:" || exit 1 - 若用 GitHub Actions,可配合
htmlhint-action,它自动把error条目转为 job failure
自定义规则时容易忽略的两个执行上下文
HTMLHint 支持通过 rulesdir 加载自定义规则,但规则函数内部访问的 node 并非 DOM 节点,而是 AST 节点;且规则运行时没有浏览器环境,window、document 都不可用。
典型翻车场景:有人写了个规则去检查 <img> 标签是否都有 alt,但顺手用了 img.naturalWidth === 0 —— 这个属性在 AST 解析阶段根本不存在,直接报 TypeError 导致整个检查中断。
- 可用的只有 HTMLHint 提供的 AST 结构,例如
node.tagName、node.attrs、node.children - 自定义规则函数签名固定为
(ast, opts, reporter) => { ... },不要试图调用 DOM API - 调试建议:先用
console.log(node)打印 AST,确认结构再写逻辑
与 ESLint/SonarQube 的阈值逻辑有本质区别
ESLint 的 max-len 规则能配 {"code": 120},SonarQube 能设圈复杂度阈值为 15 —— 它们真正在做数值比较。HTMLHint 没有这类内置数值规则,所有“阈值”都是人工归类的结果。
比如你想控制内联样式数量,不能写 "inline-style-max-count": 3,而得自己写一条规则遍历所有 style 属性,统计出现次数,再调用 reporter.error() 或 reporter.warning()。
- 官方规则里最接近“数值阈值”的是
"attr-max-len",但它只检查单个属性值长度,不是全局计数 - 真要实现“全文件最多 2 处
onclick”,必须手写规则 + 计数器 + 最终汇总判断 - 这种定制成本高,不如先用现成规则守住底线,再用其他工具(如 custom ESLint plugin 处理混合 HTML/JS 场景)补位
前端入门到VUE实战笔记:立即使用
在学习笔记中,你将探索 前端 的入门与实战技巧!










