Skip to content

/setup-pre-commit

Set up Husky pre-commit hooks with lint-staged (Prettier), type checking, and tests in the current repo. Use when user wants to add pre-commit hooks, set up Husky, configure lint-staged, or add commit-time formatting/typechecking/testing.

From plugin
mattpocock-skills
261k29 skills
Install
$ npx -y skills add mattpocock/skills --skill setup-pre-commit --agent claude-code

How it fires

How this skill gets triggered: by you, by Claude, or both.

  • Fires itselfAuto-invocation. Claude auto-loads it when your prompt matches the work.Auto-invocation is when the right skill fires by itself at the right moment, driven by a FLOW.md router and a hook, instead of you invoking it by name. It is the difference between a skill being installed and a skill actually getting used.Read the full definition →
  • You can call itInvoke it directly when you want it.
  • Slash command/setup-pre-commit

Context preview

The summary Claude sees to decide when to auto-load this skill.

Set up Husky pre-commit hooks with lint-staged (Prettier), type checking, and tests in the current repo. Use when user wants to add pre-commit hooks, set up Husky, configure lint-staged, or add commit-time formatting/typechecking/testing.

SKILL.md

setup-pre-commit.SKILL.md
name: setup-pre-commit
description: Set up Husky pre-commit hooks with lint-staged (Prettier), type checking, and tests in the current repo. Use when user wants to add pre-commit hooks, set up Husky, configure lint-staged, or add commit-time formatting/typechecking/testing.

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
Read more
Ships withmattpocock-skills

My agent skills that I use every day to do real engineering - not vibe coding. Developing real applications is hard. Approaches like GSD, BMAD, and Spec-Kit try to help by owning the process.

Get the whole plugin, auto-invoked
Stats
260,424
Stars
21,963
Forks
Active
Maintenance
Shell
Language
MIT
License
10d ago
Last commit
7mo ago
Created
2mo ago
Added

Repo: mattpocock/skills

Other skills on mattpocock-skills.