lhci autorun默认不失败是设计选择而非bug,它仅采集、上传、生成报告,不校验分数;需显式配置assertions(如"categories:accessibility": ["error", {"minscore": 0.9}])才能拦截低分构建,且必须包含collect.url、assert.assertions、upload.target三项最小配置。

lhci autorun 默认不失败,不是 bug 是设计选择
直接在 CI 里跑 lhci autorun 后看到构建绿了,但报告里 categories:accessibility 得分只有 42,这不是工具失灵,而是 Lighthouse CI 故意不卡点。它默认只采集、上传、生成报告,不校验分数——因为早期接入时,历史页面问题太多,硬拦截会阻塞发布。
要让 CI 真正“拦住低分”,必须显式写 assertions。比如:
assert:
assertions:
"categories:accessibility": ["error", {"minScore": 0.9}]
"categories:performance": ["error", {"minScore": 0.85}]
-
minScore是小数(0.9 = 90 分),写成90会被静默忽略 - 没配
"categories:accessibility"这条,哪怕得分是 0,CI 也完全不检查 - 多个 URL 同时测试时,任一 URL 不达标就失败;想放宽可用
multiple: "first"或"all"
lighthouserc.json 缺这三项,断言根本不会生效
很多人写了 assertions 却发现 CI 依然不报错,大概率是 .lighthouserc.json 漏了关键块。最小可行配置必须包含三部分:
-
collect.url:必须是能直连的地址,比如http://localhost:3000;CI 中服务没起来或返回 404/重定向,采集就失败 -
assert.assertions:至少声明你要盯的维度,如"categories:performance"和"categories:accessibility" -
upload.target:推荐用"temporary-public-storage";若用自建 server,url必须带协议(http://或https://),且 CI 容器能访问到
漏掉 upload,报告传不上,断言无数据可校;写错 target,上传失败但 autorun 不报错,断言变成空转。
如果你了解HTML,CSS和JavaScript,您已经拥有所需的工具开发Android应用程序。本动手本书展示了如何使用这些开源web标准设计和建造,可适应任何Android设备的应用程序 - 无需使用Java。您将学习如何创建一个在您选择的平台的Android友好的网络应用程序,然后转换与自由PhoneGap框架到一个原生的Android应用程序。了解为什么设备无关的移动应用是未来的潮流,并开始构建应用程序,提供更
CI 里跑分比本地低 30 分?先看环境差异
本地 DevTools 跑出 95 分,CI 里掉到 65,大概率不是代码问题,而是环境导致 DOM 渲染或资源加载异常:
-
Node.js版本:LHCI v13+ 要求Node ≥ 18,CI 镜像用node:16会降级兼容模式,影响LCP等指标采集 - 页面没等“真正就绪”:React/Vue 应用依赖 JS 渲染内容,需在
collect中加"waitFor": "document.querySelector('#app').offsetHeight > 0" - 网络节流干扰:CI 默认启用
throttling(模拟 4G),但开发服没压缩、没缓存头,首屏资源加载超时,导致FID/CLS异常;设"throttling": "provided"关闭即可 - Chrome 扩展干扰:CI 用的是干净 Chrome 实例,但本地浏览器插件(尤其是广告屏蔽、暗色模式)可能往 DOM 注入元素,导致本地分虚高
HTML 层面扣分项,静态扫描就能暴露
Lighthouse 的 accessibility 和 seo 审计不执行 JS,只静态解析 HTML。所以这些写法会立刻拉低分数:
-
<img>缺alt,或alt=""但没加role="presentation" -
<input id="email">和<label for="emial"></label>ID 拼错或大小写不一致 - 用
<div onclick="submit()"> 模拟按钮,却没加 <code>role="button" tabindex="0" - 导航菜单没包在
<nav></nav>里,主标题跳级(<h1></h1>后直接<h3></h3>) - 文本颜色靠内联样式写死(
style="color:#333"),Lighthouse 难以准确提取对比度
修复这些不需要改逻辑、不加 JS,只动 HTML 就能提分。但要注意:测试前禁用所有浏览器扩展,它们可能劫持 DOM 或样式,让本地结果失真。










