setup-pre-commit

作者: mattpocock

在當前儲存庫中設定 Husky pre-commit hooks,包含 lint-staged(Prettier)、型別檢查與測試。當使用者想要新增 pre-commit hooks、設定 Husky、配置 lint-staged,或加入提交時的格式化/型別檢查/測試時使用。

npx skills add https://github.com/mattpocock/skills --skill setup-pre-commit

Setup Pre-Commit Hooks

What This Sets Up

  • Husky pre-commit hook
  • lint-staged running Prettier on all staged files
  • Prettier config (if missing)
  • typecheck and test scripts in the pre-commit hook

Steps

1. Detect package manager

Check for package-lock.json (npm), pnpm-lock.yaml (pnpm), yarn.lock (yarn), bun.lockb (bun). Use whichever is present. Default to npm if unclear.

2. Install dependencies

Install as devDependencies:

husky lint-staged prettier

3. Initialize Husky

npx husky init

This creates .husky/ dir and adds prepare: "husky" to package.json.

4. Create .husky/pre-commit

Write this file (no shebang needed for Husky v9+):

npx lint-staged
npm run typecheck
npm run test

Adapt: Replace npm with detected package manager. If repo has no typecheck or test script in package.json, omit those lines and tell the user.

5. Create .lintstagedrc

{
  "*": "prettier --ignore-unknown --write"
}

6. Create .prettierrc (if missing)

Only create if no Prettier config exists. Use these defaults:

{
  "useTabs": false,
  "tabWidth": 2,
  "printWidth": 80,
  "singleQuote": false,
  "trailingComma": "es5",
  "semi": true,
  "arrowParens": "always"
}

7. Verify

  • .husky/pre-commit exists and is executable
  • .lintstagedrc exists
  • prepare script in package.json is "husky"
  • prettier config exists
  • Run npx lint-staged to verify it works

8. Commit

Stage all changed/created files and commit with message: Add pre-commit hooks (husky + lint-staged + prettier)

This will run through the new pre-commit hooks: a good smoke test that everything works.

Notes

  • Husky v9+ doesn't need shebangs in hook files
  • prettier --ignore-unknown skips files Prettier can't parse (images, etc.)
  • The pre-commit runs lint-staged first (fast, staged-only), then full typecheck and tests

來自 mattpocock 的更多技能

writing-for-agents
mattpocock
為代理編寫文件。在建立或編輯技能,或修改 AGENTS.md 或 CLAUDE.md 時使用。
wait-what
mattpocock
停。上一則訊息沒有達到效果——重新調整說法。
communication
to-questionnaire
mattpocock
將你無法完全回答的決定轉化為問卷,供他人填寫。
grill-me
mattpocock
持續追問使用者關於某個計畫或設計,直到達成共識,並逐一釐清決策樹的每個分支。適用於使用者想對計畫進行壓力測試、接受設計挑戰,或提到「grill me」時。
researchcommunicationproject-management
tdd
mattpocock
以紅-綠-重構循環進行測試驅動開發。當使用者想透過TDD建立功能或修復錯誤、提及「紅-綠-重構」、需要整合測試,或要求測試優先開發時使用。
developmenttesting
handoff
mattpocock
將當前對話壓縮成一份交接文件,供其他代理接手處理。
communicationproject-managementdocument
prototype
mattpocock
建立一個可拋棄的原型,在確定設計前先完善構想。在兩個分支之間切換——一個可執行的終端應用程式,用於測試狀態或商業邏輯問題;或從同一路由切換多種截然不同的UI變體。當使用者想要製作原型、驗證資料模型或狀態機、模擬UI、探索設計選項,或說出「把這個做成原型」、「讓我玩玩看」、「試試幾種設計」時使用。
developmentdesigncreative
triage
mattpocock
透過由分類角色驅動的狀態機來分類問題。當使用者想要建立問題、分類問題、審查傳入的錯誤或功能請求、為AFK代理準備問題,或管理工作流程時使用。
developmentproject-managementcommunication