How to Disable Specific ESLint Rules for a Single File in Airbnb Config

Use an /* eslint-disable rule-name */ comment at the top of the file for quick overrides, or define a targeted overrides entry in your .eslintrc for centralized, version-controlled configuration management.

Airbnb’s JavaScript style guide is enforced through the eslint-config-airbnb shared configuration, which aggregates strict rules for React and vanilla JavaScript projects. When you extend "airbnb" in your ESLint configuration, you inherit a comprehensive rule set that may occasionally conflict with legitimate exceptions in specific files. Fortunately, ESLint’s standard mechanisms for rule shadowing allow you to disable specific ESLint rules for a single file without modifying your global config.

How Airbnb’s Config Handles Rule Overrides

The Airbnb configuration is architected as a thin wrapper around base rule sets, making it straightforward to override rules for specific scopes. In packages/eslint-config-airbnb/index.js, the main entry point simply extends the base configuration and React-specific plugins:

// packages/eslint-config-airbnb/index.js
module.exports = {
  extends: [
    'eslint-config-airbnb-base',
    './rules/react',
    './rules/react-a11y',
  ].map(require.resolve),
  rules: {}
};

Because the rules object is empty, any rule declaration you add later—whether through a file-level comment or a configuration override—takes precedence over the extended Airbnb defaults. This architecture is demonstrated in the config’s own .eslintrc at packages/eslint-config-airbnb/.eslintrc, which shows how to shadow inherited rules:

// packages/eslint-config-airbnb/.eslintrc
{
  "extends": "./index.js",
  "rules": {
    "comma-dangle": 0
  }
}

Setting a rule to 0 or "off" effectively disables it for the matched scope, allowing granular control when Airbnb’s strict defaults are too restrictive for specific implementation details.

Method 1: File-Level ESLint Comments

For immediate, file-local suppression without touching your .eslintrc, prepend the target file with an eslint-disable comment listing the specific rules to turn off.

Syntax and Placement

Place the comment at the very top of the file, before any import statements or code. List multiple rules as comma-separated values:

/* eslint-disable no-console, react/prop-types */

import React from 'react';

function Logger({ message }) {
  console.log('Logging:', message); // no-console is silenced for this file only
  return <span>{message}</span>;
}

This approach disables the specified rules for the remainder of the file. To re-enable rules later in the same file (rarely needed), use /* eslint-enable rule-name */.

Method 2: Using the Overrides Section in .eslintrc

For persistent, project-tracked exceptions—especially when multiple files require the same relaxation—use the overrides array in your root ESLint configuration. This keeps source files clean and documents exceptions explicitly in version control.

Configuration Structure

Define a files glob pattern to target specific paths, then supply a rules object containing the Airbnb rules to disable:

{
  "extends": "airbnb",
  "overrides": [
    {
      "files": ["src/utils/debug-logger.js"],
      "rules": {
        "no-console": "off",
        "no-restricted-syntax": "off"
      }
    },
    {
      "files": ["src/legacy/**/*.js"],
      "rules": {
        "no-var": "off",
        "vars-on-top": "off"
      }
    }
  ]
}

Each override entry shadows the Airbnb defaults only for files matching the glob pattern, leaving the rest of your codebase fully protected by the original rule set.

Method 3: Combining Both Approaches

In rare debugging scenarios, you might use overrides for permanent exceptions while temporarily adding inline comments for immediate debugging sessions:

/* eslint-disable no-debugger */
debugger; // Allowed only here; rule remains active elsewhere in the file

This hybrid approach maintains clean configuration files while allowing rapid, temporary rule suspension during development.

Summary

• Airbnb’s config is extendable: The empty rules object in packages/eslint-config-airbnb/index.js ensures that any subsequent rule declaration shadows the shared defaults.
• Use comments for speed: Prepend /* eslint-disable rule-name */ to a file for immediate, local suppression without configuration changes.
• Use overrides for maintenance: Define targeted entries in the overrides array of your .eslintrc to disable Airbnb rules for specific files or directories while keeping source code clean.
• Both methods are compatible: ESLint’s configuration cascading guarantees that the most specific rule definition wins, whether defined inline or in a config file.

Frequently Asked Questions

Can I disable multiple Airbnb ESLint rules at once for a single file?

Yes. In a file-level comment, list multiple rules as comma-separated values: /* eslint-disable no-console, react/prop-types, import/no-extraneous-dependencies */. In an overrides entry, include multiple key-value pairs in the rules object to disable several rules simultaneously for the matched files.

Does disabling a rule in one file affect other files in the project?

No. File-level eslint-disable comments affect only the file containing the comment. Similarly, overrides entries using the files glob pattern apply exclusively to matched paths. All other files continue to follow the full Airbnb rule set defined in your root configuration.

What is the difference between eslint-disable and eslint-disable-next-line?

/* eslint-disable rule-name */ disables the specified rule for all subsequent lines in the file (or until eslint-enable), while // eslint-disable-next-line rule-name suppresses the rule only for the immediately following line. Use the former for file-wide exceptions in specific modules, and the latter for one-off exceptions without broadening the suppression scope.

Can I disable Airbnb rules for an entire directory instead of individual files?

Yes. Use the overrides section in your .eslintrc with a glob pattern targeting the directory: "files": ["src/legacy/**/*"]. This disables the specified rules for all files within that directory tree while maintaining strict Airbnb standards throughout the rest of your codebase.

{
  "mcpServers": {
    "instagit": {
      "command": "npx",
      "args": ["-y", "instagit@latest"]
    }
  }
}