How to use Husky for Git hooks

Husky simplifies Git hook management by installing hooks automatically through npm, ensuring all team members use the same pre-commit and pre-push validations. As the creator of CoreUI, a widely used open-source UI library, I’ve implemented Husky in collaborative development workflows throughout my 25 years of development experience. The most effective approach is installing Husky via npm and configuring hooks in package.json or dedicated hook files. This method ensures hooks work consistently across all developers without manual .git/hooks setup.

Install Husky and configure hooks through npm scripts for automatic team-wide enforcement.

npm install --save-dev husky
npx husky init

Then create a pre-commit hook:

npx husky add .husky/pre-commit "npm run lint && npm test"

Your package.json should include:

{
  "scripts": {
    "prepare": "husky install",
    "lint": "eslint .",
    "test": "jest"
  },
  "devDependencies": {
    "husky": "^8.0.0"
  }
}

Here npx husky init creates the .husky directory and sets up the installation script. The prepare script runs automatically after npm install, installing hooks for all team members. The husky add command creates a pre-commit hook that runs linting and tests before each commit. If either command fails, the commit aborts. This ensures code quality standards apply uniformly across the team without relying on developers to manually configure local hooks.

Best Practice Note:

This is the Git hook management we enforce in CoreUI repositories for consistent code quality across contributors. Keep hooks fast to avoid slowing down commits, use lint-staged to only check modified files, and provide a –no-verify escape hatch documentation for emergency commits while maintaining hook enforcement as the default workflow.


Speed up your responsive apps and websites with fully-featured, ready-to-use open-source admin panel templates—free to use and built for efficiency.


About the Author

Subscribe to our newsletter
Get early information about new products, product updates and blog posts.
How to show or hide elements in React? A Step-by-Step Guide.
How to show or hide elements in React? A Step-by-Step Guide.

What is the Difference Between Null and Undefined in JavaScript
What is the Difference Between Null and Undefined in JavaScript

How to Use JavaScript setTimeout()
How to Use JavaScript setTimeout()

How to loop through a 2D array in JavaScript
How to loop through a 2D array in JavaScript

Answers by CoreUI Core Team