ESLint и Prettier
Тема дорожной карты · Frontend разработчик
ESLint — это подключаемый инструмент статического анализа для JavaScript и TypeScript, который находит и устраняет проблемы качества кода до того, как они попадут в продакшн. Frontend-команды настраивают ESLint через eslint.config.js (плоский конфиг, ESLint v9+) или устаревший .eslintrc.json, объявляя наборы правил eslint:recommended, plugin:react/recommended и plugin:@typescript-eslint/recommended для соблюдения единых стандартов кодирования в проекте. ESLint интегрируется со сборщиками Vite и Webpack, прерывая сборку при наличии ошибок линтинга, а также с редакторами через расширение ESLint для VS Code для получения обратной связи в реальном времени. Команда eslint --fix автоматически исправляет многие проблемы форматирования и стиля, что делает ESLint незаменимым партнёром Prettier в любом современном JavaScript или TypeScript frontend-рабочем процессе.
Как это работает
ESLint и Prettier трансформирует исходник (TypeScript, JSX, современный JS, CSS Modules, ассеты) в бандлы, которые браузер исполнит, желательно оптимизированные под кеш и code splitting. Vite (dev-time esbuild + prod Rollup) — современный дефолт: быстрый HMR, разумные дефолты. Webpack — legacy, но повсеместен. Turbopack и Rspack — bun-/Rust-based эксперименты. Parcel — zero-config. Dev-сервер даёт HMR (Hot Module Replacement), правки отражаются без full reload.
Когда применять
Vite — для любого нового проекта: самый простой, быстрый, активно поддерживаемый. Webpack — только если проект уже на нём и миграция дорогая. Code-split по route-границе (lazy load). Bundle-аналитика (vite-plugin-visualizer, webpack-bundle-analyzer) — чтобы видеть, что шипится. Цель — < 200 KB начального JS gzipped на типичной странице.
Типичные ошибки
Ловушки ESLint и Prettier: деплой неминифицированных dev-бандлов в production; импорт всей библиотеки, когда нужна одна функция (import _ from "lodash" вместо import map from "lodash/map"); нет dynamic imports для route-level splitting; нет source maps в production (отладка вслепую); коммит dist/ или node_modules в git. Аудит размера бандла ежемесячно — он только растёт.