Read this article in ukrainian: https://devcenter.space/uk/posts/eslint-setup/

Read more articles about ESLint in my personal blog: https://devcenter.space/

What is ESLint?

ESLint is a linter for NodeJS applications. Its purpose is to automatically detect potential problems in your code. Linters, and ESLint in particular, can identify not only problems in code formatting, but also see potential bugs, problems in operation, gaps in the security of your application.

This is what makes ESLint different from the code formatting tool, Prettier, which can only find and fix code style issues, but won't tell you if your code contains an error. Prettier can be used in combination with ESLint to promote code styles. More about how to install Prettier - (in a separate article).

Installation

In order to automatically install ESLint and add all the necessary files for work, it is enough to write the following command in the terminal:

npm init @eslint/config

After entering the command, you will be asked which ESLint feature you plan to use. The selection is made with the keyboard arrows, and the selection window itself looks like this:

Based on your selection, the linter settings will be selected.

Configuration process

There is no point in describing the full process at this time, but I would like to draw your attention to a few points:

"How would you like to define a style for your project?"

In this option, I advise you to choose the guide option if you are setting up ESLint for the first time. Any settings you need can be changed after installation whenever you need.

"Which style guide do you want to follow?"

Again, for the first time I advise you to set Standard, and change if necessary.

"What format do you want your config file to be in?"

Here you can choose any of the formats. But I would like to emphasize that most articles on the Internet use the JSON format. This article will be no exception.

After the installation process, a .eslintrc.* file with the selected extension should appear in your project.

My .eslintrc.json looks like this:

ESLint plugins

ESLint, in addition to the standard set of rules, has an interface for installing add-ons (plugins) into your project. In order to use a custom plugin, you need to install it via npm/yarn, and then add the plugin to the plugins list.

An example of setting up the Prettier plugin for ESLint can be seen in the previous article.

Useful plugins for ESLint found here.

IDE support

Some IDEs require additional configuration to enable ESLint error highlighting in the editor. Plugins or guides for configuring ESLint for popular IDEs:

• Visual Studio Code
• WebStorm
• Sublime Text
• Vim
• Atom

Summary

ESLint is a linter for NodeJS applications with extensive functionality that will help you monitor compliance with code styles in your project, help you find potential bugs or syntax errors. ESLint can be configured quite flexibly by point-editing its rules and installing external add-ons. ESLint has integration with an extensive list of development environments.

Read more about ESLint

• ESLint best practices: link
• How to create a balanced ESLint config: link
• Difference between ESLint Plugins and Rules: link
• Official documentation: link.

More articles.