April 22, 2026
Setting up ESLint

ESLint is a fantastic tool to improve your JavaScript code quality. Here’s a breakdown of setting it up with an example:

Installation:

  1. Package.json: Make sure your project has a package.json file. If not, you can create one using npm init or yarn init.
  2. ESLint Package: Install ESLint as a development dependency using either npm or yarn:
npm install eslint --save-dev

Configuration:

ESLint offers two main Configuration methods:

  • Configuration File: This is the recommended approach for most projects.Create a file named .eslintrc.js or eslint.config.js in your project’s root directory. This file will contain JavaScript code defining your ESLint rules and setting. Inline Comments ( Not recommended) : You can use special comments within your JavaScript files to configure ESLint for specific parts of your code. However, this approach is less maintainable for complex projects.

Example Configuration (.eslintrc.js):

module.exports = {
  rules: {
    semi: ["error", "always"], // Enforces semicolons at the end of statements
    quotes: ["error", "double"], // Enforces double quotes for strings
  },
};

This example enforces semicolons and double quotes for strings in your code. You can find a comprehensive list of ESLint rules and their options in the official documentation https://eslint.org/docs/latest/use/configure/rules.

Running ESLint:

Once you have ESLint installed and configured, you can run it to lint your JavaScript files. There are several ways to do this:

  • Command Line: Open your terminal and navigate to your project directory. Then, run:
eslint .
  • This command will lint all JavaScript files in the current directory and its subdirectories.
  • Code Editor Integration: Many popular code editors like Visual Studio Code offer ESLint integration. This allows you to see ESLint warnings and errors directly within your editor as you code.

Example Output:

Running ESLint might produce output like this if you have errors in your code:

./my-file.js
1: Missing semicolon semi ✖

✖ 1 problem (1 error)

This indicates an error on line 1 of my-file.js for missing a semicolon.

Author