ConfigsApr 12, 2026·3 min read

ESLint — The Pluggable JavaScript and TypeScript Linter

ESLint is the most widely used linter for JavaScript and TypeScript. It statically analyzes your code to find problems, enforce coding standards, and automatically fix many issues. Its plugin system supports React, Vue, Node.js, and more.

TL;DR
ESLint finds problems and enforces coding standards in JavaScript and TypeScript.
§01

What it is

ESLint is the most widely used linter for JavaScript and TypeScript. It statically analyzes your code to find problems, enforce coding standards, and automatically fix many issues. Its plugin system supports React, Vue, Angular, Node.js, and virtually any JavaScript ecosystem through community rules.

ESLint targets every JavaScript and TypeScript developer. Whether you work solo or on a large team, ESLint catches bugs, prevents anti-patterns, and ensures code consistency before your code reaches review or production.

§02

Why it saves time or tokens

ESLint catches bugs like unreachable code, unused variables, and type coercion issues before runtime. The auto-fix feature corrects many style and logic issues automatically. When AI assistants generate JavaScript code, running ESLint on the output validates correctness and style compliance without human review of every line, reducing the iteration tokens needed to get clean code.

§03

How to use

  1. Install ESLint: npm install -D eslint
  2. Initialize config: npx eslint --init and choose your framework and style preferences
  3. Run ESLint: npx eslint . --fix to lint and auto-fix your codebase
§04

Example

// eslint.config.js (flat config format)
import js from '@eslint/js';
import tseslint from 'typescript-eslint';

export default [
  js.configs.recommended,
  ...tseslint.configs.recommended,
  {
    rules: {
      'no-unused-vars': 'error',
      'no-console': 'warn',
      'prefer-const': 'error',
      '@typescript-eslint/no-explicit-any': 'warn'
    }
  }
];
Rule CategoryExamples
Possible Errorsno-undef, no-unreachable
Best Practicesno-eval, prefer-const
Stylesemi, quotes, indent
TypeScriptno-explicit-any, strict types
Frameworkreact/jsx-no-undef
§05

Related on TokRepo

§06

Common pitfalls

  • ESLint 9 uses flat config (eslint.config.js) by default; legacy .eslintrc files require the ESLINT_USE_FLAT_CONFIG=false flag
  • Combining ESLint style rules with Prettier causes conflicts; use eslint-config-prettier to disable overlapping rules
  • Too many enabled rules overwhelm developers with warnings; start with a recommended config and add rules incrementally

Frequently Asked Questions

What is the flat config format in ESLint 9?+

ESLint 9 introduced flat config using eslint.config.js instead of .eslintrc files. Flat config uses JavaScript modules, provides better type safety, and eliminates the extends/overrides complexity. Each element in the exported array is a config object applied in order. This is now the default format.

How does ESLint work with TypeScript?+

Use typescript-eslint, which provides a parser and plugin for TypeScript-specific rules. It parses .ts and .tsx files using the TypeScript compiler, enabling type-aware linting rules that catch issues like unsafe any usage, incorrect type assertions, and unused type imports.

Can ESLint auto-fix code?+

Yes. Many ESLint rules support auto-fix. Run eslint --fix to automatically correct fixable issues like missing semicolons, incorrect quotes, unused imports, and spacing. Not all rules are auto-fixable; some require manual review. The fix output is deterministic.

How does ESLint compare to Biome?+

Biome is a newer, faster alternative to ESLint plus Prettier, written in Rust. It handles both linting and formatting in one tool. ESLint has a much larger plugin ecosystem and more rules. Choose ESLint for maximum customization and framework support. Choose Biome for speed and simplicity.

Should I use ESLint with Prettier?+

Yes, they are complementary. ESLint handles code quality rules (no-unused-vars, no-eval). Prettier handles formatting (indentation, line breaks, quotes). Use eslint-config-prettier to disable ESLint formatting rules that conflict with Prettier. Run both in your editor and CI pipeline.

Citations (3)

Discussion

Sign in to join the discussion.
No comments yet. Be the first to share your thoughts.

Related Assets