停止在每次提交时运行整个测试套件 🚫🧪

Source: Dev.to

问题

我们都有过这样的经历：你做了一个小改动，提交代码，却要等整个测试套件运行好几分钟。

在每次提交前运行完整的测试套件会：

• ⏰ 慢 – 浪费宝贵的开发时间
• 😤 令人沮丧 – 打断你的专注状态
• 🔄 冗余 – 测试你根本没有改动的代码

大多数开发者的做法是：

• 完全跳过测试（危险）
• 等待漫长的测试运行（令人沮丧）
• 推送后祈祷 CI 能捕捉到问题（风险）

必须有更好的办法。

介绍 test‑staged

test-staged 类似于 lint-staged，但用于测试。它能够智能地识别与你的暂存更改相关的测试，只运行这些测试。

工作原理

更多运行器即将推出！

安装

# npm
npm install -D test-staged

# pnpm
pnpm add -D test-staged

# yarn
yarn add -D test-staged

# bun
bun add -D test-staged

默认零配置。

与 Husky 一起使用

# Install husky
npm install -D husky
npx husky init

# Add test‑staged to pre‑commit hook
echo "npx test-staged" > .husky/pre-commit

Now every commit will:

• ✅ 仅运行与您更改相关的测试
• ⚡ 在几秒钟内完成，而不是几分钟
• 🛡️ 如果测试失败，阻止提交

实际案例

示例 1：用户认证功能

# You modified:
git add src/auth/login.ts

test-staged 仅运行 以下：

src/auth/__tests__/login.test.ts
src/integration/__tests__/auth-flow.test.ts   # because it imports login.ts

它会跳过不相关的套件，例如 src/payments/__tests__/*.test.ts 和 src/dashboard/__tests__/*.test.ts。

结果：测试在 3 秒 内完成，而不是 2 分钟。

示例 2：重构实用函数

# You modified:
git add src/utils/formatDate.ts

test-staged 自动找到所有相关的测试：

src/utils/__tests__/formatDate.test.ts
src/components/__tests__/DatePicker.test.ts
src/pages/__tests__/Dashboard.test.ts

示例 3：Monorepo 支持

# You're in packages/ui
git add Button.tsx

仅运行：

packages/ui/__tests__/Button.test.tsx

它 不会 运行 packages/api/ 或 packages/cli/ 中的测试。

性能提升

在一个典型的包含 500+ 测试的项目中：

≈ 36 倍 的速度提升，在实际使用中。

配置（可选）

package.json

{
  "test-staged": {
    "runner": "jest",
    "mode": "related",
    "testExtensions": [".test", ".spec", ".e2e"]
  }
}

.test-stagedrc.json

{
  "runner": "vitest",
  "testExtensions": [".test", ".spec", "Test", "E2E"]
}

常规工作流程

# 进行更改
vim src/components/Button.tsx

# 将其暂存
git add src/components/Button.tsx

# 提交（test‑staged 会通过 pre‑commit hook 自动运行）
git commit -m "fix: button hover state"

输出示例

Running tests for staged files...
✓ src/components/__tests__/Button.test.tsx (2 tests) 0.8s

Tests passed! ✨
[main abc1234] fix: button hover state

无需手动测试命令，无需等待，也不会出现损坏的提交。

FAQ

Q: 如果我想运行所有测试怎么办？
A: 使用 git commit --no-verify 绕过钩子，或手动运行测试套件。

Q: 它能在 CI 中使用吗？
A: 能。CI 仍应运行完整的测试套件。test-staged 只用于本地开发加速。

Q: 那集成测试/E2E 测试怎么办？
A: 如果它们导入了被修改的文件，就会运行。你也可以自定义哪些测试会被视为需要运行。

Q: 我可以不使用 Git 钩子吗？
A: 当然可以。随时手动运行 npx test-staged。

一分钟内快速入门

npm install -D test-staged husky
npx husky init
echo "npx test-staged" > .husky/pre-commit

然后进行一次提交，观看魔法的发生。 ✨

资源

• 📦 NPM 包
• 📖 文档
• 🐙 GitHub 仓库
• 🐛 报告问题

结论

如果你仍然在每次提交时运行整个测试套件，那就是在浪费时间。test-staged 为你提供：

• ⚡ 更快的提交（秒级而非分钟）
• 🎯 更好的聚焦（仅测试已更改的部分）
• 🛡️ 更安全的代码（测试真的会运行）
• 🚀 改进的开发者体验（零配置，即可使用）

试试看并告诉我们你的想法！🙌