# How to Set Up Pre-Commit Hooks with Airbnb ESLint

> Easily set up pre-commit hooks to automatically lint your JavaScript code with Airbnb ESLint. Block commits with style violations for cleaner code.

- Repository: [Airbnb/javascript](https://github.com/airbnb/javascript)
- Tags: how-to-guide
- Published: 2026-02-24

---

**Configure a Git pre-commit hook that runs `npm run lint` using `eslint-config-airbnb` to automatically block commits containing JavaScript style violations.**

The `airbnb/javascript` repository distributes one of the industry's most widely adopted JavaScript style guides as the shareable ESLint configuration `eslint-config-airbnb`. To guarantee that every commit adheres to these rigorous coding standards, you can leverage Git's hook system to execute linting before changes are permanently recorded. This guide demonstrates how to implement this enforcement using the exact files and scripts maintained in the Airbnb source code.

## Install the Airbnb ESLint Configuration

Before configuring hooks, you must install the style guide and its required peer dependencies. According to the `peerDependencies` declared in [`packages/eslint-config-airbnb/package.json`](https://github.com/airbnb/javascript/blob/main/packages/eslint-config-airbnb/package.json), you need the base config plus several essential plugins.

Execute the following command to install all required packages:

```bash
npm install --save-dev eslint-config-airbnb eslint-plugin-import eslint-plugin-jsx-a11y eslint-plugin-react eslint-plugin-react-hooks

```

## Configure ESLint to Extend Airbnb Rules

The repository provides a minimal configuration reference in `linters/.eslintrc` that demonstrates the proper way to extend the Airbnb ruleset. Create an `.eslintrc` file in your project root containing:

```json
{
  "extends": "airbnb"
}

```

This single line activates all of Airbnb's linting rules, including their strict React and ES6+ requirements.

## Create the Pre-Commit Hook

The `airbnb/javascript` repository includes a Git hook template at `.git/hooks/pre-commit.sample` that serves as the foundation for automated linting.

### Manual Hook Setup

First, activate the sample hook by copying it to the live hooks directory:

```bash
cp .git/hooks/pre-commit.sample .git/hooks/pre-commit
chmod +x .git/hooks/pre-commit

```

Next, edit `.git/hooks/pre-commit` and replace its contents with a script that executes your lint command. The repository defines the standard lint script at line 19 of [`packages/eslint-config-airbnb/package.json`](https://github.com/airbnb/javascript/blob/main/packages/eslint-config-airbnb/package.json) as `"lint": "eslint ."`.

Insert this enforcement logic into your hook:

```bash
#!/bin/sh

# Run Airbnb-based ESLint before every commit

npm run lint
if [ $? -ne 0 ]; then
  echo "✖ Lint errors detected – aborting commit."
  exit 1
fi

```

This script runs `npm run lint` and aborts the commit with a non-zero exit status whenever ESLint reports errors.

### Husky-Based Configuration

For team environments where hooks must persist across clones, use **Husky** to version-control your hook configuration rather than relying on the `.git/hooks` directory.

Install Husky and create the hook:

```bash
npm install --save-dev husky
npx husky install
npx husky add .husky/pre-commit "npm run lint"

```

Ensure your [`package.json`](https://github.com/airbnb/javascript/blob/main/package.json) includes the prepare script for automatic setup:

```json
{
  "scripts": {
    "lint": "eslint .",
    "prepare": "husky install"
  }
}

```

## Test the Enforcement

Verify your setup by attempting to commit code that violates Airbnb rules, such as using `var` instead of `const`:

```javascript
// Intentional violation of Airbnb style guide
var badVariable = true;

```

When you execute `git commit`, the hook should display output similar to:

```

$ npm run lint

> my-project@1.0.0 lint
> eslint .

/src/index.js
  12:7  error  Unexpected var, use let or const instead  no-var

✖ 1 problem (1 error, 0 warnings)

```

The commit will immediately abort, preventing the style violation from entering your repository history.

## Summary

- **Install peer dependencies**: Add `eslint-config-airbnb` and its required plugins as specified in [`packages/eslint-config-airbnb/package.json`](https://github.com/airbnb/javascript/blob/main/packages/eslint-config-airbnb/package.json).
- **Extend the config**: Reference `"airbnb"` in your `.eslintrc`, following the template provided in `linters/.eslintrc`.
- **Activate the hook**: Copy `.git/hooks/pre-commit.sample` to `.git/hooks/pre-commit` and insert the `npm run lint` command to enforce checks.
- **Block bad commits**: The hook's exit code logic ensures commits containing linting errors are rejected immediately.
- **Use Husky for teams**: Replace manual `.git/hooks` editing with Husky to share hook configurations through version control.

## Frequently Asked Questions

### Do I need Husky to set up pre-commit hooks with Airbnb ESLint?

No, Husky is optional. You can manually copy `.git/hooks/pre-commit.sample` to `.git/hooks/pre-commit` and add the lint command directly for immediate local enforcement. However, Husky stores hooks within your project directory, making the configuration portable across team members and fresh repository clones.

### What command does the pre-commit hook actually execute?

The hook runs `npm run lint`, which executes `eslint .` as defined at line 19 of [`packages/eslint-config-airbnb/package.json`](https://github.com/airbnb/javascript/blob/main/packages/eslint-config-airbnb/package.json). This command lints all JavaScript files in your project against the rules specified in your `.eslintrc` extension of the Airbnb config.

### Can I lint only specific files or directories in the pre-commit hook?

Yes, modify the lint script in your [`package.json`](https://github.com/airbnb/javascript/blob/main/package.json) or alter the command in the hook script. For example, use `eslint src/` to lint only your source directory, or `eslint --cache .` for faster incremental linting. The hook will respect any ESLint CLI options you specify.

### Why does the hook abort the commit when ESLint reports warnings?

By default, ESLint exits with code 0 for warnings and 1 for errors, so warnings alone should not abort the commit. If you want to block commits on warnings as well, add the `--max-warnings=0` flag to your script: `"lint": "eslint --max-warnings=0 ."`. This forces the hook to treat warnings as fatal errors.