New to Claude Skills? Learn how to install them →

Smattpocock on GitHub

Setup Pre-Commit Hooks

Free

Automate your pre-commit process with Husky and lint-staged.

by mattpocock212.7k stars on mattpocock/skills
3 views
Updated Aug 6, 2026
Get this skill

Free · Opens the source repo

What Setup Pre-Commit Hooks does

The Setup Pre-Commit Hooks skill streamlines the process of setting up pre-commit hooks in your repository using Husky and lint-staged. This skill is particularly useful for developers looking to enforce code quality and consistency by automatically formatting code, performing type checks, and running tests before commits. By integrating tools like Prettier, this skill ensures that your codebase adheres to defined styling rules, reducing the likelihood of style-related issues in your project.

When you activate this skill, it intelligently detects your package manager (npm, pnpm, yarn, or bun) and installs the necessary dependencies, including Husky, lint-staged, and Prettier. It then initializes Husky in your project, creating the necessary configuration files and scripts to automate the pre-commit process. The skill also sets up lint-staged to run Prettier on all staged files, ensuring that only the files you intend to commit are formatted correctly.

Moreover, the skill includes checks to create a Prettier configuration file if one does not already exist, ensuring that your project has a consistent formatting standard. The pre-commit hook is designed to run lint-staged first for efficiency, followed by type checking and testing if those scripts are defined in your package.json. This structured approach helps maintain high code quality and can save time during code reviews and merges.

This skill is ideal for teams and individual developers who want to implement a robust pre-commit workflow without manual setup. It simplifies the process of adding essential checks and formatting to your development workflow, making it easier to maintain a clean and functional codebase.

When to use it

Use this skill when you want to implement pre-commit hooks in your repository for linting, formatting, and testing.

When not to use it

This skill may not be suitable if your project does not use a supported package manager or if you prefer to manage pre-commit hooks manually.

What you can build with it

Implementing Code Standards

A team wants to ensure that all code adheres to specific formatting and quality standards before it gets committed.

Automating Testing

A developer seeks to automate running tests and type checks to catch errors early in the development process.

Streamlining Onboarding

New team members need a quick way to set up pre-commit hooks in their local repositories to maintain consistency.

How to install Setup Pre-Commit Hooks

View source

1. Install with the skills CLI

npx skills add mattpocock/skills/setup-pre-commit --agent claude-code

2. Or install it manually

Download the skill folder and drop it into ~/.claude/skills/ for all projects, or .claude/skills/ to scope it to one repo. Restart Claude Code so it picks up the new skill.

Anthropic's agentic coding CLI, and the reference implementation of Agent Skills. Drop a skill folder into ~/.claude/skills and Claude Code loads it automatically whenever a task matches the skill's description. Claude Code docs

Inside SKILL.md

Written by mattpocock

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

Frequently asked questions about Setup Pre-Commit Hooks

Similar skills