×


Understanding Linting, getting started with ESLint for Node.js development with IDE Visual Studio Code

Node.js application developers usually come across the requirement to adhere to linting rules during the development phase. In this article we will understand the importance of following linting rules and how to set up ESLint with Node.js. We will also see how to easily identify and fix linting errors with Visual Studio Code.

 

 

Linting

Linting is static code analysis, which helps to identify errors, coding style issues, insecure code, etc during the development phase. Linter is a tool that helps to identify lining errors while writing code. Linting is done during the phase of writing the code.

Static code analysis is a method of debugging by examining source code before a program is run.

Linting helps to improve code quality, provide better structure, speed up the overall development process by flagging potential errors early.

 

Linting JavaScript/TypeScript source code with Node.js

Identifying linting errors in JavaScript code is done using the linting tool ESLint. If you are using TypeScript TSLint is used.

 

Linting Rules

Linting rules are the rules which are enforced on the source code by the linter. For example, to enforce that the length of a single line of code not to exceed 140 characters max-len rule is used with ESLint. max-lines is used to limit the number of lines in a file.max-lines-per-function is used to limit the number of lines per function.

While working with ESLint, the configuration file in which the linting rules are stored is .eslintrc.{js,yml,json}

 

Now let us see how to setup ESlint with Node.js and fix the errors using visual studio code

 

step 1:  Initialize a Node.js project

Run npm init to set up a Node.js project. A package.json will be created. Create an index.js file.

Add the function to index.js file

 

 

step2: Install ESLint, ESLint CLI and initialize 

Navigate to project folder and install ESLint as a dev dependency using the command

AND

To globally install ESLint CLI

 

Initialize ESLint by running the command

Answer the questions and it will generate an eslintrc configuration file. Choose JSON for now.

 

 

step3: Update eslintrc.json file with rules and finding lint errors with CLI 

Edit eslintrc.json file with the rules.

1 – warning, 2 -error and 0 disabled

 

 

Update your package.json  – script part with the following line of code.

Running npm run lint will display errors like this

 

 

 

 

step 4: Install ESLint plugin in Visual Studio Code

Search Visual studio code for plugins and install ESLint then restart.

 

 

 

step 5: Identifying and fixing errors with Visual Studio Code

Max Length error

 

 

Number of lines in a function

 

 

Unused variables

 

 

Quick fix unused variables error. Click on the bulb icon or quick fix link to fix errors automatically

 

"extends": "eslint:recommended" property in a configuration file enables rules that report common problems.

eslint-config-airbnb,eslint-config-standard ,are standards that are node modules that can be also extended in the above way.

eslint-plugin-security  will help to identify potential security hotspot

 

The documentation for ESLint can be found here https://eslint.org/

Thanks for reading. Get started with ESLint now and write quality code.

No Comments

Leave a Reply

Your email address will not be published. Required fields are marked *