如何在ESLint新配置规范下正确使用eslint-config-airbnb？

目前官方的eslint-config-airbnb尚未完全适配ESLint的Flat Config新规范，你可以通过以下两种方案解决：

方案1：利用ESLint的旧版配置兼容工具 #

ESLint提供了@eslint/eslintrc包来兼容旧版配置，你可以通过它将airbnb的旧配置转换为Flat Config格式：

// eslint.config.js
import { FlatCompat } from '@eslint/eslintrc';
import path from 'path';
import { fileURLToPath } from 'url';

const __filename = fileURLToPath(import.meta.url);
const __dirname = path.dirname(__filename);
const compat = new FlatCompat({ baseDirectory: __dirname });

export default [
  // 转换并引入airbnb配置
  ...compat.extends('airbnb'),
  // 在这里添加你的自定义规则
  {
    rules: {
      // 示例：关闭某个规则
      'react/jsx-uses-react': 'off'
    }
  }
];

如果你的ESLint版本低于v8.23.0，需要手动安装@eslint/eslintrc：

npm install @eslint/eslintrc --save-dev

方案2：使用社区适配好的Flat Config版本 #

社区已经有适配Flat Config的Airbnb风格配置包，比如eslint-config-airbnb-flat，直接安装使用更简便：

1. 安装依赖：

npm install eslint-config-airbnb-flat --save-dev

2. 配置eslint.config.js：

// eslint.config.js
import airbnb from 'eslint-config-airbnb-flat';

export default [
  ...airbnb,
  // 添加自定义规则
  {
    rules: {
      // 你的自定义规则
    }
  }
];

内容的提问来源于stack exchange，提问作者Varunkumar Nagarajan