ESLint — The Pluggable JavaScript and TypeScript Linter

Introduction

ESLint is the standard static analysis tool for JavaScript and TypeScript codebases. Created by Nicholas C. Zakas in 2013, it identifies problematic patterns, enforces coding conventions, and automatically fixes many issues. Unlike formatters that only handle style, ESLint catches actual bugs — unused variables, unreachable code, type coercion issues, and more.

With 27,000+ GitHub stars and billions of npm downloads, ESLint is used by virtually every professional JavaScript project. Its pluggable architecture supports hundreds of rules for React, Vue, Angular, Node.js, TypeScript, accessibility, and security.

What ESLint Does

ESLint parses your JavaScript/TypeScript code into an AST and runs a set of rules against it. Each rule checks for a specific pattern — from stylistic preferences to potential runtime errors. Rules can report warnings or errors, and many can automatically fix the code.

Architecture Overview

[Source Code] --> [Parser]
                  espree (default) or
                  @typescript-eslint/parser
                       |
                  [AST (ESTree format)]
                       |
              +--------+--------+
              |        |        |
          [Rule 1] [Rule 2] [Rule N]
          no-unused  eqeqeq  custom
          -vars              rules
              |        |        |
              +--------+--------+
                       |
              [Report: errors, warnings]
              [Auto-fix: applied patches]

Self-Hosting & Configuration

// eslint.config.js — ESLint v9 flat config
import js from "@eslint/js";
import tseslint from "typescript-eslint";
import react from "eslint-plugin-react";

export default [
  js.configs.recommended,
  ...tseslint.configs.recommended,
  {
    files: ["**/*.{ts,tsx}"],
    plugins: { react },
    rules: {
      "no-unused-vars": "warn",
      "no-console": ["error", { allow: ["warn", "error"] }],
      "react/prop-types": "off"
    }
  },
  {
    ignores: ["dist/", "node_modules/"]
  }
];

Key Features

• Pluggable Rules — enable, disable, or configure any rule individually
• Auto-Fix — many rules can automatically fix the code they flag
• TypeScript Support — first-class TS linting via typescript-eslint
• Framework Plugins — eslint-plugin-react, eslint-plugin-vue, and hundreds more
• Flat Config — new simplified configuration system in ESLint v9
• Custom Rules — write your own rules for project-specific patterns
• Editor Integration — real-time feedback in VS Code, IntelliJ, and others
• CI Ready — exit codes and formatters for CI pipeline integration

Comparison with Similar Tools

FAQ

Q: What is the difference between ESLint and Prettier? A: ESLint finds code quality issues (bugs, anti-patterns). Prettier handles code formatting (indentation, line length). Use both together — Prettier for formatting, ESLint for logic. Use eslint-config-prettier to prevent rule conflicts.

Q: How do I migrate to flat config (eslint.config.js)? A: ESLint v9 uses flat config by default. The @eslint/migrate-config tool can automatically convert your .eslintrc file. Flat config is simpler — it uses native JS imports instead of string-based extends.

Q: Should I switch to Biome or oxlint? A: If you use mostly built-in and typescript-eslint rules, Biome is faster and simpler. If you rely on framework-specific plugins (React hooks, Vue, accessibility), ESLint remains essential for its plugin ecosystem.

Q: How do I lint TypeScript with ESLint? A: Install typescript-eslint and configure it in your flat config. It provides type-aware linting rules that can catch issues like unsafe any usage and floating promises.

Sources

• GitHub: https://github.com/eslint/eslint
• Documentation: https://eslint.org
• Created by Nicholas C. Zakas
• License: MIT