VSCode需配合插件与测试框架才能显示覆盖率:Wallaby.js开箱即用;vscode-jest需配置collectCoverage: true;Coverage Gutters仅读取已有报告,不生成数据。

VSCode里跑测试不显示覆盖率?先确认有没有装对插件
VSCode本身不内置代码覆盖率功能,必须靠插件 + 测试框架配合。最常用且稳定的是 Wallaby.js(商业,但免费版够用)和开源的 vscode-jest(需配合 Jest)或 Python Test Explorer(Pytest 场景)。别直接搜“coverage”,容易装错成纯展示插件——比如 Coverage Gutters 只能读取已有覆盖率报告,不会帮你跑测试生成它。
-
Wallaby.js自动注入、实时刷新、支持 Jest / Vitest / Pytest / NUnit,开箱即用,适合想少配多看的人 -
vscode-jest免费,但要求项目已配好jest.config.js且collectCoverage: true开启;否则点“运行测试”后覆盖率栏永远灰着 - Python 用户注意:
pytest-cov必须安装,且命令行要带--cov=src这类参数,插件才读得到数据
Jest 测试跑完没覆盖率数字?检查配置里漏没漏 collectCoverage
很多人在 package.json 里写 "test": "jest",看着测试绿了就以为完事了——其实默认 collectCoverage 是 false,压根不生成报告。VSCode 插件再聪明也读不到空文件。
- 在
jest.config.js中显式加:collectCoverage: true,并指定coverageDirectory: "coverage" - 或者临时命令行验证:
npx jest --collectCoverage,看终端是否输出覆盖率表格 - 常见坑:
collectCoverageFrom路径写错(比如写成src/**.ts却漏了**/*.ts的双星),导致只扫了部分文件,覆盖率偏低还找不到原因
Coverage Gutters 插件显示“no coverage data”?它不干活,只读报告
Coverage Gutters 是个“哑巴插件”:它不运行测试、不生成报告、也不调 Jest,纯粹解析 coverage/lcov.info 或 coverage/coverage-final.json 这类文件,然后在编辑器左侧标红绿行。如果文件不存在或路径不对,它就沉默。
- 先手动跑一次完整测试生成报告:
npx jest --coverage,确认coverage/lcov.info出现在项目根目录下 - 在 VSCode 设置里搜
coverage-gutters.coverageFileNames,确保值包含lcov.info(默认已含,但有人手贱删过) - 如果用的是 Vitest,它默认输出
coverage/vitest-coverage.json,而Coverage Gutters默认不认这个格式——得换Wallaby.js或改用vitest --coverage输出 lcov
覆盖率数字忽高忽低,甚至同一行标红又标绿?留意测试执行范围
不是插件抽风,是测试没跑全。VSCode 插件常默认只运行当前文件的测试(比如你光标停在 math.test.ts,它就只跑这个),但覆盖率统计是按源码文件算的——如果 math.ts 里有分支逻辑,但只有部分测试覆盖了它,那行覆盖率就会浮动。
- 右键测试文件时,选
Run All Tests而不是Run Current Test File,确保整个collectCoverageFrom范围都被扫描 - Vitest 用户注意:
vitest --coverage默认只覆盖被测试文件 import 的模块,没被任何 test 引入的工具函数,即使存在也不会进报告 - 编辑器重启后首次运行可能缓存旧报告,删掉
coverage/目录再试一次,比猜强
覆盖率数字本身没意义,关键是你知道它从哪来、怎么断、为什么变。插件只是镜子,照得清不清,取决于你喂给它的数据干不干净。


















