在 React 项目中配置单元测试覆盖率阈值需通过 Jest 的 coverageThreshold 实现，支持全局、目录或文件级设置，须配合 collectCoverage: true 或 --coverage 启用，路径需以 / 结尾，阈值未达标时测试失败。
在 React 项目中配置单元测试覆盖率阈值，核心是通过 Jest 的配置项 coverageThreshold 实现。它支持按文件、目录或全局设置最低覆盖率要求，未达标时测试会失败（CI 中尤其有用）。
在 jest.config.js 中设置覆盖率阈值
推荐使用 jest.config.js（而非 package.json 中的 jest 字段），便于扩展和维护：
- 在项目根目录创建或编辑
jest.config.js - 添加
coverageThreshold配置对象，指定各维度的最小百分比（整数或小数） - 阈值为
null表示忽略该维度；为0表示允许为 0%
示例配置：
module.exports = {
// ...其他配置
collectCoverage: true,
coverageDirectory: 'coverage',
coverageReporters: ['lcov', 'text-summary'],
coverageThreshold: {
global: {
branches: 80,
functions: 85,
lines: 85,
statements: 85
},
'./src/components/': {
statements: 90
},
'./src/utils/': {
functions: 100
}
}
};
配合 npm script 控制行为
确保运行测试时启用覆盖率收集，并让阈值生效：
立即学习“Java免费学习笔记（深入）”；
-
npm test -- --coverage：临时启用覆盖率（但不触发阈值检查） - 更可靠的方式是在
package.json中定义脚本，强制检查阈值：
"scripts": {
"test:ci": "jest --coverage --coverageThreshold={\"global\":{\"lines\":80}}",
"test:watch": "jest --watch"
}
注意：命令行传参中的 JSON 需用双引号并转义，实际推荐把完整配置写在 jest.config.js 中，脚本只需 "test:ci": "jest --coverage" 即可。
常见问题与建议
覆盖率阈值容易因配置方式不当而失效：
-
必须开启覆盖率收集：
collectCoverage: true或运行时加--coverage，否则coverageThreshold不起作用 -
路径匹配需准确：目录路径以
/结尾（如'./src/components/'），且基于项目根目录解析 - 阈值是硬性约束：任一维度未达标，Jest 进程退出码为 1，CI 流程将中断
-
初始阶段可设宽松值：比如先设
lines: 70，再逐步提升，避免阻塞开发
验证配置是否生效
运行测试后观察控制台输出：
- 若覆盖率低于阈值，会看到类似
Failed to meet coverage threshold的错误信息，并列出各维度实际值与目标值 - 生成的
coverage/lcov-report/index.html可直观查看各文件覆盖率 - 添加
--verbose参数有助于排查配置加载问题（如配置文件未被识别）
