setup-pre-commit — Claude Code skill: setup guide
This skill configures pre-commit checks for a JavaScript repository, running Prettier, type checking, and tests before each commit.
- Author Matt Pocock
- License MIT
- GitHub ★ 302,251
- Installs 489,289
- Updated 2026-10-22
- Source shown below
What setup-pre-commit does
setup-pre-commit adds Husky and creates .husky/pre-commit. The hook runs lint-staged, then typecheck and test when those scripts exist in package.json. Prettier handles staged files, while formats it cannot parse are skipped.
The skill detects the package manager from package-lock.json, pnpm-lock.yaml, yarn.lock, or bun.lockb. It installs husky, lint-staged, and prettier, adds prepare: "husky", and creates .lintstagedrc. A .prettierrc file is added only when the repository has no Prettier configuration. Husky is initialized with npx husky init.
It then checks the generated files and runs npx lint-staged. If typecheck or test is missing from package.json, the matching hook line is left out. Install it when commits should enforce formatting and repository checks; projects without those npm scripts will get a smaller hook.
What it helps with
- add a Husky pre-commit hook
- format staged files with Prettier
- run type checking before commits
- execute tests during commit creation
- create lint-staged configuration
How to install setup-pre-commit
Command from the source
/plugin marketplace add mattpocock/skillsCommand from the source
/plugin install mattpocock-skills@mattpocockCommand from the source
npx skills add mattpocock/skills --skill setup-pre-commit -a claude-codeWith the Skills CLI (Vercel)
npx skills add mattpocock/skills --skill setup-pre-commit -a claude-codeManually
~/.claude/skills/setup-pre-commit/SKILL.mdCopy the whole skill folder; for one project use .claude/skills/setup-pre-commit/
Manually
.agents/skills/setup-pre-commit/SKILL.mdFor all projects use ~/.agents/skills/
Manually
.cursor/skills/setup-pre-commit/SKILL.mdCursor also reads .agents/skills/ and .claude/skills/
GitHub CLI (gh ≥ 2.90)
gh skill install mattpocock/skills setup-pre-commitManually
.github/skills/setup-pre-commit/SKILL.mdGemini CLI
gemini skills install https://github.com/mattpocock/skills --path skills/misc/setup-pre-commitManually
.devin/skills/setup-pre-commit/SKILL.mdThe legacy .windsurf/skills/ path still works
Claude.ai
Zip the folder and upload it in Settings → Capabilities → Skills
How to use it: example prompts
- Set up pre-commit hooks in the current repository.
- Add Husky with lint-staged and run Prettier, typecheck, and test before commits.
- Verify the new `.husky/pre-commit` and create the required config files.
Source text
SKILL.md · MIT
---
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
```bash
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`
```json
{
"*": "prettier --ignore-unknown --write"
}
```
### 6. Create `.prettierrc` (if missing)
Only create if no Prettier config exists. Use these defaults:
```json
{
"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
© Matt Pocock · MIT · mattpocock/skills
Questions about setup-pre-commit
How do I install setup-pre-commit in Claude Code?
Add the marketplace with /plugin marketplace add mattpocock/skills, then install it with /plugin install mattpocock-skills@mattpocock.
What does setup-pre-commit do?
It configures Husky, lint-staged, and Prettier in the current repository. The pre-commit hook formats staged files and runs type checking and tests when those scripts exist in package.json.
How does setup-pre-commit choose the package manager?
It checks for package-lock.json, pnpm-lock.yaml, yarn.lock, or bun.lockb. If no lock file identifies a manager, it uses npm.