Начало работы с ESLint

ESLint — это инструмент для выявления и отображения шаблонов в коде ECMAScript/JavaScript, цель которого — сделать код более единообразным и избежать ошибок.

ESLint полностью расширяем. Каждое правило является плагином, и вы можете добавлять новые во время выполнения. Вы также можете добавлять плагины сообщества, конфигурации и парсеры, чтобы расширить функциональность ESLint.

Предварительные требования

Для использования ESLint необходимо установить Node.js (^20.19.0, ^22.13.0 или >=24), собранный с поддержкой SSL. (В официальных дистрибутивах Node.js поддержка SSL всегда включена.)

Если вы используете определения типов TypeScript для ESLint, требуется TypeScript версии 5.3 или новее.

Быстрый старт

Установить и настроить ESLint можно с помощью этой команды:

npm init @eslint/config@latest

yarn create @eslint/config

pnpm create @eslint/config@latest

bun create @eslint/config@latest

Если вы хотите использовать определённую общедоступную конфигурацию, размещённую в npm, укажите параметр --config и имя пакета:

# use `eslint-config-xo` shared config - npm 7+
npm init @eslint/config@latest -- --config eslint-config-xo

# use `eslint-config-xo` shared config - npm 7+
yarn create @eslint/config -- --config eslint-config-xo

# use `eslint-config-xo` shared config - npm 7+
pnpm create @eslint/config@latest -- --config eslint-config-xo

# use `eslint-config-xo` shared config - npm 7+
bun create @eslint/config@latest -- --config eslint-config-xo

Примечание: npm init @eslint/config предполагает, что у вас уже есть файл package.json. Если его нет, сначала выполните команду npm init или yarn init.

После этого можно запустить ESLint для любого файла или каталога следующим образом:

npx eslint yourfile.js 

yarn dlx eslint yourfile.js 

pnpm dlx eslint yourfile.js 

bunx eslint yourfile.js 

Конфигурация

Примечание: Если вы используете версию до 9.0.0, ознакомьтесь с руководством по миграции.

При запуске npm init @eslint/config вам будет предложено ответить на ряд вопросов, чтобы определить, как вы используете ESLint и какие параметры следует включить. После ответов на эти вопросы в вашем каталоге будет создан файл eslint.config.js (или eslint.config.mjs).

Например, один из вопросов: «Где выполняется ваш код?» Если вы выберете «Браузер», файл конфигурации будет содержать определения глобальных переменных, доступных в веб-браузерах. Вот пример:

import { defineConfig } from "eslint/config";
import globals from "globals";
import js from "@eslint/js";

export default defineConfig([
	{ files: ["**/*.js"], languageOptions: { globals: globals.browser } },
	{ files: ["**/*.js"], plugins: { js }, extends: ["js/recommended"] },
]);

Конфигурация "js/recommended" включает все правила, отмеченные как рекомендуемые на странице правил. Также можно использовать конфигурации, созданные другими пользователями: найдите «eslint-config» на сайте npmjs.com. ESLint не будет проверять ваш код, если вы не расширите общую конфигурацию или явно не включите правила в своей конфигурации.

Можно настроить отдельные правила, определив новый объект с ключом rules, как в этом примере:

import { defineConfig } from "eslint/config";
import js from "@eslint/js";

export default defineConfig([
	{ files: ["**/*.js"], plugins: { js }, extends: ["js/recommended"] },

	{
		rules: {
			"no-unused-vars": "warn",
			"no-undef": "warn",
		},
	},
]);

Имена "no-unused-vars" и "no-undef" — это названия правил ESLint. Первое значение задаёт уровень ошибки правила и может быть одним из следующих:

• "off" или 0 — отключить правило
• "warn" или 1 — включить правило как предупреждение (не влияет на код завершения)
• "error" или 2 — включить правило как ошибку (код завершения будет равен 1)

Три уровня ошибок позволяют точно контролировать применение правил ESLint (дополнительные параметры и сведения см. в документации по конфигурации).

Глобальная установка

ESLint также можно установить глобально, а не локально, с помощью npm install eslint --global. Однако это не рекомендуется: все используемые плагины и общедоступные конфигурации всё равно необходимо устанавливать локально, даже если ESLint установлен глобально.

Настройка вручную

Вы также можете настроить ESLint в проекте вручную.

Перед началом у вас уже должен быть файл package.json. Если его нет, сначала выполните команду npm init или yarn init, чтобы создать файл.

1. Установите пакеты ESLint в проект:

npm install --save-dev eslint@latest @eslint/js@latest

yarn add --dev eslint@latest @eslint/js@latest

pnpm add --save-dev eslint@latest @eslint/js@latest

bun add --dev eslint@latest @eslint/js@latest

2. Добавьте файл eslint.config.js:

   # Create JavaScript configuration file
   touch eslint.config.js
   

3. Добавьте конфигурацию в файл eslint.config.js. Инструкции по добавлению правил, пользовательских конфигураций, плагинов и других элементов см. в документации по настройке ESLint.

   import { defineConfig } from "eslint/config";
   import js from "@eslint/js";
   
   export default defineConfig([
   	{
   		files: ["**/*.js"],
   		plugins: {
   			js,
   		},
   		extends: ["js/recommended"],
   		rules: {
   			"no-unused-vars": "warn",
   			"no-undef": "warn",
   		},
   	},
   ]);
   

4. Проверьте код с помощью ESLint CLI:

npx eslint project-dir/ file.js 

yarn dlx eslint project-dir/ file.js 

pnpm dlx eslint project-dir/ file.js 

bunx eslint project-dir/ file.js 

Дополнительные сведения о доступных параметрах CLI см. в разделе Интерфейс командной строки.

Дальнейшие шаги

• Узнайте о расширенной настройке ESLint.
• Ознакомьтесь с параметрами командной строки.
• Изучите интеграции ESLint с другими инструментами, например редакторами, системами сборки и другими.
• Не нашли подходящее правило? Создайте собственное пользовательское правило.
• Помогите сделать ESLint ещё лучше — внесите свой вклад.