How to configure ESLint

Olivier Trinh
2 min readSep 18, 2023

--

ESLint is a JavaScript linter that helps you write better code. It can identify potential errors and stylistic problems in your code, and suggest ways to fix them. ESLint is highly customizable, and you can configure it to meet the specific needs of your project.

To configure ESLint, you can use either configuration comments or configuration files.

Configuration comments

Configuration comments are a way to embed configuration information directly into your code. To do this, you use a special comment format. For example, the following comment enables the no-unused-vars rule:

// @eslint-disable no-unused-vars

You can also use configuration comments to disable individual rules for specific lines of code. For example, the following comment disables the no-console-log rule for the next line of code:

// @eslint-disable no-console-log
console.log('Hello, world!');

Configuration files

Configuration files are a more powerful way to configure ESLint. They allow you to specify configuration options for your entire project, or for specific directories or files.

To create a configuration file, you need to create a file called .eslintrc. This file can be in JSON, YAML, or JavaScript format.

The following is an example of a simple .eslintrc.js file:

module.exports = {
rules: {
'no-unused-vars': 'error',
'no-console-log': 'warn',
},
};

This configuration file enables the no-unused-vars rule with an error severity, and the no-console-log rule with a warn severity.

You can also use configuration files to extend other configuration files. For example, the following configuration file extends the eslint-config-airbnb configuration file:

module.exports = {
extends: 'eslint-config-airbnb',
rules: {
// Override some rules from the eslint-config-airbnb configuration file
'comma-dangle': ['error', 'always'],
'no-console-log': 'off',
},
};

This configuration file will enable all of the rules from the eslint-config-airbnb configuration file, except for the comma-dangle rule, which will be overridden to use the always style. The no-console-log rule will also be disabled.

Examples

Here are some examples of how to use ESLint configuration to enforce specific coding styles:

  • To require all functions to have a return statement, you can use the following rule:
'require-jsdoc': ['error', {
require: {
return: true,
},
}],
  • To prevent the use of the var keyword, you can use the following rule:
'no-var': 'error',
  • To enforce a consistent style for object literals, you can use the following rule:
'object-curly-spacing': ['error', 'always'],

You can find a list of all available ESLint rules in the ESLint documentation: https://eslint.org/docs/latest/rules/.

ESLint is a powerful tool that can help you write better JavaScript code. By configuring ESLint to meet the specific needs of your project, you can identify and fix potential problems before they deploy to production.

--

--