Skip to content

Legacy Config ​

The Legacy Config is designed for teams who want a One-To-One/Drop-In Replacement for the original Airbnb ESLint configs, but with support for Flat Config (ESLint 9+).

Instead of rewriting rules, this mode focuses on parity and smooth migration. If your team already uses:

  • eslint-config-airbnb
  • eslint-config-airbnb-base
  • eslint-config-airbnb-typescript

You can switch to eslint-config-airbnb-extended/legacy with minimal diffs while being future-ready.

Overview ​

The legacy entrypoint provides:

  • Configs → Predefined sets of rules that map directly to the Airbnb family.
  • Rules → Core rule groups that enforce good coding practices and are used in configs.

This ensures your project setup is familiar, stable, and ESLint 9-ready.

Configs ​

The configs mirror the original Airbnb packages, making migration straightforward.

1. For eslint-config-airbnb-base ​

Use this if you want only JavaScript base rules without React or TypeScript.

ts
import { configs } from 'eslint-config-airbnb-extended/legacy';

// Equivalent to airbnb-base/legacy
export default [...configs.base.legacy];

// Equivalent to airbnb-base
export default [...configs.base.recommended];

2. For eslint-config-airbnb ​

Use this when working with React. It provides a one-to-one mapping with all the standard Airbnb React presets, including hooks.

ts
import { configs } from 'eslint-config-airbnb-extended/legacy';

// Equivalent to airbnb/legacy
export default [...configs.react.legacy];

// Equivalent to airbnb/base
export default [...configs.react.base];

// Equivalent to airbnb
export default [...configs.react.recommended];

// Equivalent to airbnb/hooks
export default [...configs.react.hooks];

3. For eslint-config-airbnb-typescript ​

Use this if you’re on TypeScript and want the Airbnb TypeScript rules, but in Flat Config format without breaking compatibility.

ts
import { configs } from 'eslint-config-airbnb-extended/legacy';

// Equivalent to airbnb-typescript/base
export default [...configs.base.typescript];

// Equivalent to airbnb-typescript
export default [...configs.react.typescript];

Rules ​

The rules are the building blocks of configs. Each config combines these rule groups.

Base Rules ​

Rule GroupDescription
Best PracticesEnforces common best practices to improve code quality and maintainability.
ErrorsHelps catch runtime errors and unsafe patterns early.
ES6Provides rules specific to ES6+ syntax and features.
ImportsEnsures proper import/export usage with eslint-plugin-import.
NodeIncludes Node.js-specific rules for server-side development.
StrictEnables strict mode rules.
StyleCovers general code style rules such as spacing, quotes, and semicolons.
VariablesValidates variable declarations, usage, and scoping rules.

React Rules ​

Rule GroupDescription
BaseCore React rules for JSX and component structure.
JSX AccessibilityAccessibility rules via eslint-plugin-jsx-a11y for inclusive UIs.
HooksRules from eslint-plugin-react-hooks ensuring proper hook usage.

TypeScript Rules ​

Rule GroupDescription
BaseCore TypeScript linting rules for types, syntax, and consistency.
OverridesAdjusts ESLint by disabling rules covered by TypeScript and enabling ones that benefit from type-checking.
SettingsAdditional config values for TypeScript resolver and parser options.

Why Legacy Config Exists ​

  • 1:1 replacements → drop-in equivalents of Airbnb configs.
  • Flat Config ready → works with ESLint 9 and beyond.
  • Migration path → lets you start simple, then move to extended or strict configs later.
  • Less churn → developers see fewer rule changes when upgrading.

If you’re upgrading a project that already relies on Airbnb configs, start with Legacy Config to make the transition safe and low-friction. Once you’re stable, you can move on to Extended (modernized rules) or even Strict Mode for maximum consistency.

Released under the MIT License.