setup-pre-commit

Sets up Husky and lint-staged pre-commit hooks for JavaScript/TypeScript projects.

12|Updated Dec 25, 2024
One-click install
npx skills add https://github.com/whyte25/reusables --skill setup-pre-commit-whyte25
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: setup-pre-commit
Source: https://github.com/whyte25/reusables/tree/main/.agents/skills/setup-pre-commit
Command: npx skills add https://github.com/whyte25/reusables --skill setup-pre-commit-whyte25

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill solves the problem of inconsistent code quality by ensuring every commit runs formatting, type checking, and tests before it lands in your repository.

Core Features & Use Cases

  • Husky pre-commit hook to block commits until checks pass.
  • lint-staged with Prettier to format only staged changes for fast feedback.
  • Commit-time typecheck and tests (when available) to catch errors early.
  • Use Case: You’re working in a team and want every pull request branch to start from commits that already pass formatting and the same verification steps.

Quick Start

Ask to set up pre-commit hooks in the current repo using Husky, lint-staged (Prettier), and commit-time type checking and tests where the npm scripts exist.

Frequently Asked Questions about setup-pre-commit

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I set up pre-commit hooks with Husky and lint-staged?

To set up pre-commit hooks, this configures Husky and lint-staged to run Prettier formatting on staged files, automatically detecting your package manager to validate and create the required hook configurations.

Can I run typecheck and tests automatically before a Git commit?

Yes, you can run commit-time typecheck and tests automatically by configuring the pre-commit hook to execute these scripts during the commit process, provided the necessary npm scripts already exist in your repository.

How does lint-staged with Prettier format only staged changes?

lint-staged with Prettier formats only staged changes by running the formatter exclusively on files staged in Git, ensuring fast feedback without modifying unstaged work in your JavaScript or TypeScript repository.

Does this pre-commit setup work with different package managers?

Yes, the pre-commit setup adapts to different package managers by detecting the repository's specific package manager and adjusting the Husky and lint-staged commands accordingly during configuration.

Why use lint-staged instead of formatting the whole repository?

Using lint-staged instead of formatting the whole repository ensures fast feedback by applying Prettier only to staged changes, preventing slow commits and avoiding conflicts with unstaged files in your local workspace.

What is needed to add commit-time quality gates to a JavaScript repository?

To add commit-time quality gates to a JavaScript repository, you need Husky for Git hooks and lint-staged configured with Prettier, plus existing npm scripts if you want to enforce typecheck and test execution.