Структура файла eslint.config.js

Структура eslint.config.js в современной конфигурации ESLint (flat config) строится как последовательность объектов конфигурации, объединённых в единый экспорт. В отличие от классического .eslintrc, где использовались вложенные поля и механизм overrides, новый формат опирается на явную композицию и порядок применения конфигураций сверху вниз.

Файл eslint.config.js представляет собой модуль JavaScript, который экспортирует массив:

export default [
  // конфигурационные объекты
];

Каждый элемент массива — отдельный блок конфигурации. ESLint применяет их последовательно, объединяя результаты. Порядок элементов имеет критическое значение: более поздние блоки могут переопределять предыдущие.

Базовая структура конфигурационного объекта

Типичный объект конфигурации содержит следующие ключевые поля:

  • files
  • ignores
  • languageOptions
  • plugins
  • rules
  • settings
  • linterOptions

Каждое поле отвечает за отдельный аспект анализа кода.

Поле files: область применения конфигурации

files определяет, к каким файлам применяется конкретный блок конфигурации.

{
  files: ["src/**/*.js"]
}

Возможные варианты:

  • конкретные файлы: "index.js"
  • шаблоны glob: "src/**/*.ts"
  • массивы шаблонов

Если поле отсутствует, конфигурация применяется ко всем файлам проекта (если не ограничена другими блоками).

Поле ignores: исключения из анализа

ignores задаёт пути, которые ESLint полностью исключает из обработки.

{
  ignores: ["dist/**", "node_modules/**"]
}

Особенности:

  • применяется до анализа правил
  • поддерживает glob-выражения
  • может использоваться как в отдельных блоках, так и на верхнем уровне массива

Пример глобального исключения:

export default [
  {
    ignores: ["dist/**"]
  }
];

languageOptions: настройка интерпретации кода

languageOptions определяет, как ESLint должен понимать исходный код.

Основные подполя:

ecmaVersion

languageOptions: {
  ecmaVersion: 2022
}

Определяет версию ECMAScript, влияя на доступные синтаксические конструкции.

Часто используются значения:

  • 2020, 2021, 2022, latest

sourceType

sourceType: "module"

Возможные значения:

  • "script" — классический JavaScript
  • "module" — ES Modules

globals

Определяет доступные глобальные переменные:

languageOptions: {
  globals: {
    window: "readonly",
    document: "readonly"
  }
}

Значения:

  • "readonly" — только чтение
  • "writable" — можно переопределять

parser

Позволяет заменить стандартный парсер:

import babelParser from "@babel/eslint-parser";

languageOptions: {
  parser: babelParser
}

Используется при работе с нестандартным синтаксисом (TypeScript, экспериментальные предложения).

parserOptions

Дополнительные настройки парсера:

languageOptions: {
  parserOptions: {
    ecmaFeatures: {
      jsx: true
    }
  }
}

plugins: подключение расширений

В flat config плагины подключаются как объекты:

import js from "@eslint/js";
import react from "eslint-plugin-react";

export default [
  {
    plugins: {
      js,
      react
    }
  }
];

Ключи объекта — имена плагинов, используемые в правилах:

rules: {
  "react/jsx-uses-react": "error"
}

Особенность flat config: плагины необходимо импортировать явно, автоматической загрузки по строковому имени нет.

rules: система правил анализа

rules — центральная часть ESLint-конфигурации.

rules: {
  "no-unused-vars": "error",
  "no-console": "warn"
}

Форматы задания:

строковые уровни

  • "off" — отключено
  • "warn" — предупреждение
  • "error" — ошибка

расширенная конфигурация

rules: {
  "eqeqeq": ["error", "always"],
  "quotes": ["error", "single", { avoidEscape: true }]
}

Первый элемент массива — уровень строгости, последующие — параметры правила.

settings: общие данные для плагинов

settings передаёт общие значения, используемые несколькими правилами или плагинами.

settings: {
  react: {
    version: "detect"
  }
}

Характерные случаи:

  • определение версии библиотек
  • общие конфигурации линтеров плагинов
  • контекстные параметры анализа

linterOptions: поведение движка ESLint

Этот блок управляет внутренним поведением линтера:

linterOptions: {
  reportUnusedDisableDirectives: true
}

Часто используемые опции:

  • reportUnusedDisableDirectives — проверка неиспользуемых eslint-disable
  • noInlineConfig — запрет inline-конфигураций в коде

Множественные конфигурационные блоки

Главная особенность eslint.config.js — композиция через массив:

export default [
  {
    files: ["**/*.js"],
    rules: {
      "no-console": "warn"
    }
  },
  {
    files: ["**/*.test.js"],
    rules: {
      "no-console": "off"
    }
  }
];

Принцип работы:

  • конфигурации применяются последовательно
  • более поздние блоки переопределяют предыдущие
  • пересечение files формирует итоговый набор правил

Порядок применения и приоритеты

При вычислении итоговой конфигурации учитываются следующие правила:

  1. ignores исключает файлы до анализа
  2. блоки массива обрабатываются сверху вниз
  3. внутри одного файла объединяются все подходящие блоки
  4. при конфликте правил побеждает последний применённый блок

Отсутствие overrides и extends как концепций

В flat config отсутствуют привычные механизмы:

  • overrides заменён множественными объектами с files
  • extends заменён импортом готовых конфигураций и их включением в массив

Пример:

import js from "@eslint/js";

export default [
  js.configs.recommended,
  {
    rules: {
      "no-debugger": "error"
    }
  }
];

Типовая структура production-конфигурации

Комбинированный пример структуры:

import js from "@eslint/js";
import react from "eslint-plugin-react";

export default [
  {
    ignores: ["dist/**", "build/**"]
  },

  js.configs.recommended,

  {
    files: ["src/**/*.js"],
    languageOptions: {
      ecmaVersion: 2022,
      sourceType: "module",
      globals: {
        window: "readonly"
      }
    },
    plugins: {
      react
    },
    rules: {
      "no-console": "warn"
    },
    settings: {
      react: {
        version: "detect"
      }
    },
    linterOptions: {
      reportUnusedDisableDirectives: true
    }
  }
];

Логическая модель конфигурации

Структура eslint.config.js строится на трёх базовых принципах:

  • декларативное описание областей (files, ignores)
  • явное управление окружением выполнения (languageOptions)
  • композиция правил через массив конфигураций

Эта модель делает конфигурацию более предсказуемой, устраняя скрытые уровни наследования и неявные расширения.

Оглавление