Почему ESLint — это хорошо

  • 12 мая 2026

JS

Евгений Шкляр

Опечатка в имени переменной, использование == вместо ===, вызов функции до её объявления — всё это браузер обнаружит только в момент выполнения кода. В лучшем случае вы увидите ошибку сразу, в худшем — она всплывёт у пользователя в продакшене.

ESLint проверяет код до запуска. Он читает файл, анализирует структуру и сообщает о проблемах прямо в редакторе или в терминале. Это называется статическим анализом, или линтингом.

Установка

npm install --save-dev eslint

Затем создаём конфигурацию:

npx eslint --init

ESLint задаст несколько вопросов: для чего используется проект, какой фреймворк, TypeScript или нет — и создаст файл eslint.config.js.

Как это выглядит в работе

Запуск по всем файлам в папке src/:

npx eslint src/

Если проблемы найдены — ESLint покажет их в терминале:

src/main.js
  5:10  error  'userName' is not defined   no-undef
  9:3   error  Expected '===' but found '=='  eqeqeq
  14:1  warning  Unexpected console statement  no-console

✖ 2 errors, 1 warning found

Каждая строка: файл, номер строки и столбца, тип (error или warning), описание, название правила.

Автоматическое исправление

Многие проблемы ESLint умеет исправлять сам — через флаг --fix:

npx eslint src/ --fix

Автоматически исправляются форматирование, лишние точки с запятой, одинарные/двойные кавычки. То, что требует смысловых решений (например, удалить неиспользуемую переменную), исправить автоматически нельзя — ESLint лишь сообщит о проблеме.

Попробуйте сами — какие ошибки найдёт ESLint

1
2
3
4
5
6
7
8
functiongreet(name) { const message = "Привет, " + userName; if (name ==null) { console.log("нет имени"); } return message; }
// нажмите «Проверить» чтобы запустить ESLint

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

Современный ESLint (версии 9+) использует файл eslint.config.js:

import js from '@eslint/js';

export default [
  js.configs.recommended,
  {
    rules: {
      'no-console': 'warn',   // предупреждение за console.log
      'eqeqeq': 'error',      // ошибка за == вместо ===
      'no-unused-vars': 'warn' // предупреждение за неиспользуемые переменные
    }
  }
];

ESLint в редакторе

Самый удобный способ — установить расширение ESLint для VS Code. Тогда ошибки будут подчёркиваться прямо в редакторе, в момент написания кода, без запуска терминала.

Что запомнить

ESLint анализирует код до его запуска и сообщает об ошибках и подозрительных местах. --fix автоматически исправляет то, что можно исправить без смысловых решений. В связке с расширением для редактора ESLint становится невидимым помощником, который поправляет вас на ходу.

«Доктайп» — журнал о фронтенде. Читайте, слушайте и учитесь с нами.

ТелеграмПодкастБесплатные учебники