Skip to content
Learni
View all tutorials
Outils de développement

How to Configure ESLint in a JavaScript Project in 2026

12 minBEGINNER
JavaScriptESLintQualité de code
Lire en français

Introduction

ESLint is the go-to tool for statically analyzing your JavaScript and TypeScript code. It detects common errors, enforces a consistent style, and prevents bugs before execution. In 2026, its integration has become essential in any professional project. This tutorial shows you how to configure ESLint from start to finish in a Node.js or simple frontend project. You will learn how to create a custom configuration, add npm scripts, and integrate it into your editor. By the end, you will have a more reliable and productive development environment.

Prerequisites

  • Node.js 18 or higher
  • An existing (or empty) JavaScript project
  • Basic command-line knowledge
  • A code editor (VS Code recommended)

Installing ESLint

terminal
npm install --save-dev eslint

This command installs ESLint as a development dependency. It adds the eslint binary to node_modules and updates your package.json.

Initializing the Configuration

terminal
npx eslint --init

The interactive tool asks a few questions about style, framework, and TypeScript. It automatically generates the configuration file suited to your project.

.eslintrc.json Configuration File

.eslintrc.json
{
  "env": {
    "browser": true,
    "es2021": true,
    "node": true
  },
  "extends": ["eslint:recommended"],
  "parserOptions": {
    "ecmaVersion": "latest",
    "sourceType": "module"
  },
  "rules": {
    "semi": ["error", "always"],
    "quotes": ["error", "single"],
    "no-unused-vars": "warn"
  }
}

This file defines the environment, base rules, and custom rules. Each rule can be set to error, warn, or off.

Adding Lint Scripts to package.json

package.json
{
  "scripts": {
    "lint": "eslint .",
    "lint:fix": "eslint . --fix"
  }
}

These scripts let you run ESLint easily with npm run lint. The --fix option automatically corrects simple issues.

.eslintignore File

.eslintignore
node_modules
build
dist
coverage
*.min.js

This file tells ESLint which directories and files to ignore. It prevents unnecessary analysis of dependencies and generated files.

Best Practices

  • Always start with the recommended rules then add more gradually
  • Use the --fix option in pre-commit hooks
  • Share configuration via a shared ESLint package in teams
  • Enable TypeScript rules only if you are using TypeScript
  • Regularly check for plugin updates

Common Mistakes to Avoid

  • Forgetting to ignore the node_modules folder (slows everything down)
  • Setting too many strict rules from the start (causes team frustration)
  • Not installing plugins that match your framework
  • Running ESLint on files already formatted by Prettier without coordination

Going Further

Integrate ESLint with Prettier, configure Husky hooks, or explore advanced TypeScript rules. Discover our Learni courses to master modern code quality tools.