Error detection automation is difficult on code side

Photo by Nathan Dumlao on Unsplash

ESLint is a Javascript code quality tool that analysis your code without executing it. It will warn you about mistakes and win you a lot of time

ESLint is a tool for identifying and reporting on patterns found in ECMAScript/JavaScript code. In many ways, it is similar to JSLint and JSHint with a few exceptions: these come with a predefined set of rules for you while ESlint has the flexibility so you can setup.
A simple example on how can this help you?
So let’s get a simple example:

function(a,b){ return a * d; }

This error is obvious when you have a small amount of code.

But if you have a large amount this will be very useful.

By running ESlint to your code you get the next output:

1:10 error 'test' is defined but never used no-unused-vars 1:17 error 'b' is defined but never used no-unused-vars 2:1 error Expected indentation of 1 tab but found 4 spaces indent 3:1 error Expected indentation of 1 tab but found 4 spaces indent 3:16 error 'd' is not defined no-undef

Without ES lint you can have unwanted bugs that can make your customers unhappy.

So part of the automation process of code quality and together with automated tests you can setup ESlint to get better code quality.

This will fix unwanted bugs and your clients can be happier.
You can see in the above code that this already found some errors and I have an already setup ESlint configuration.

Let’s do it for you!
If you want to include ESLint as part of your project’s build system, we recommend installing it locally. You can do so using npm.

Installation and Usage

Prerequisites:

Node.js (>=6.14), npm version 3+.
There are two ways to install ESLint: globally and locally.

Unrelated to this subject: In Appseed PRO version you can also get everything set up for easily checking code quality in VSCode. You can even get all the above code for free and use it yourself. Licensed MIT.

Local Installation and Usage

$ npm install eslint --save-dev

You should then setup a configuration file:

$ ./node_modules/.bin/eslint --init

At this step you will have to answer 10 simple questions on your coding style.

After that, you can run ESLint in your project’s root directory like this:

$ ./node_modules/.bin/eslint yourfile.js

Instead of navigating to ./node_modules/.bin/ you may also use npx to run eslint:

$ npx eslint

Note: If ESLint wasn’t manually installed (via npm), npx will install eslint to a temporary directory and execute it.
Any plugins or shareable configs that you use must also be installed locally to work with a locally-installed ESLint.
Global Installation and UsageIf you want to make ESLint available to tools that run across all of your projects, we recommend installing ESLint globally. You can do so using npm:

$ npm install -g eslint

You should then setup a configuration file:

$ eslint --init

After that, you can run ESLint on any file or directory like this:

$ eslint yourfile.js

Any plugins or shareable configs that you use must also be installed globally to work with a globally-installed ESLint.
So ESLint finds errors, enforces rules and can also fix issues automatically.

Running the fix command is easy:

./node_modules/.bin/eslint --fix --ext .js test.js/appseed/starter-express/test.js 1:10 error 'test' is defined but never used no-unused-vars 1:17 error 'b' is defined but never used no-unused-vars 3:13 error 'd' is not defined no-undef

After running the fix command it returns just the errors that require your attention. It’s clear that we never use the test function in our case. And looks like I made a typo on using variable d instead of b.

Let’s fix that and see the output.

The code looks like this right now:

function test(a,b){ return a * b; } test(1,2);

And the output for eslint is the one bellow:

node_modules/eslint/bin/eslint.js test.js➜ starter-express git:(feat/sequelize-orm-register) ✗

One of the best features of node you can use with npm is the package scripts.So in your package.json you can set some commands to easily run eslint from your project or call it from you travis ci.

"scripts": { "start": "node index.js", "dev": "nodemon start", "lint": "./node_modules/.bin/eslint --ext .js config/ models/ routes/ seeders/ index.js", "lint-fix": "./node_modules/.bin/eslint --fix --ext .js config/ models/ routes/ seeders/ index.js" }

This is helpful because now you can just run a simple command for testing and fixing your small errors.

npm run lint npm run lint-fix

This prepares our project for CI and CD with Travis. The next must-have in 2019.

Originally published at https://blog.appseed.us on April 15, 2019.