Skip to main content
There are two ways to use this style guide. You can read through the rules and apply them by convention in code review, or you can install the companion ESLint config and have violations flagged automatically during development. Most teams do both.

Option 1: Read the guide

Browse the rule categories in the sidebar. Each section covers a specific area of JavaScript with concrete examples of preferred and discouraged patterns, along with the reasoning behind each convention. Start with these sections if you’re new to the guide:

Option 2: Enforce with ESLint

Installing the ESLint config is the most reliable way to adopt the style guide. Rules are checked automatically on every file save or CI run, so conventions are enforced consistently without relying on code review to catch everything. Choose the package that matches your project:

eslint-config-airbnb

For React projects. Includes ECMAScript 6+ rules plus React, JSX, hooks, and accessibility rules.

eslint-config-airbnb-base

For non-React projects. Includes ECMAScript 6+ rules without any React plugins.

Install eslint-config-airbnb (with React)

1

Install the package and peer dependencies

The config requires several peer dependencies. The easiest way to install everything at once is with install-peerdeps:
npx install-peerdeps --dev eslint-config-airbnb
This installs eslint-config-airbnb along with eslint, eslint-plugin-import, eslint-plugin-react, eslint-plugin-react-hooks, and eslint-plugin-jsx-a11y.
2

Add the config to your .eslintrc

Create or update your .eslintrc file to extend the Airbnb config:
.eslintrc
{
  "extends": "airbnb"
}
To also enable React Hooks rules, extend both configs:
.eslintrc
{
  "extends": ["airbnb", "airbnb/hooks"]
}
3

Run the linter

npx eslint .
ESLint will report any violations of the Airbnb style rules across your project.

Install eslint-config-airbnb-base (without React)

1

Install the package and peer dependencies

npx install-peerdeps --dev eslint-config-airbnb-base
This installs eslint-config-airbnb-base along with eslint and eslint-plugin-import.
2

Add the config to your .eslintrc

.eslintrc
{
  "extends": "airbnb-base"
}
3

Run the linter

npx eslint .

Adopting incrementally

If you’re adding the style guide to an existing codebase, enforcing every rule immediately can generate a large number of violations. A few approaches for a smoother rollout: Start with whitespace only. Both packages ship a /whitespace entry point that errors only on whitespace rules and downgrades all other rules to warnings:
.eslintrc
{
  "extends": "airbnb/whitespace"
}
Use --fix to auto-correct. Many style violations can be fixed automatically:
npx eslint . --fix
Introduce rules gradually. You can override specific rules in your .eslintrc to turn them off while you work toward full adoption:
.eslintrc
{
  "extends": "airbnb-base",
  "rules": {
    "no-var": "warn"
  }
}
To verify which peer dependency versions are required for your installed version of the config, run:
npm info "eslint-config-airbnb@latest" peerDependencies
or for the base config:
npm info "eslint-config-airbnb-base@latest" peerDependencies

Next steps

Types and references

Start with the foundational rules around types, const, and let.

ESLint config reference

Learn about all available entry points and configuration options.

Build docs developers (and LLMs) love