Beautiful Code Formatting by Linting with ESLint

What is “Linting”?

Linting is a process of checking source code for suspicious or non-portable constructs. Or at least one definition… [1]

There are many extensions and programs to provide linting functionality for Javascript. Some of these are; JSHint, JSLint, and the one I have been using lately, ESLint.

Some may say that linting isn’t worth the effort. [2] I personally, disagree…

Linting provides a way to enforce code style standards. It can be hard to enforce code style standards on a team sometimes. People disagree with how things should be styled, they may have habits for their own style methods already, some even forget the standards exist.

Another great benefit is keeping your source lean. In ESLint at least, you can configure it to flag variables that are unused. It sounds obvious that you would just remove those variables. But in large files of source, it may be difficult to see the variable is no longer used after an update.

Tech Company Base Rules

Airbnb has a detailed style guide. I like the description, “A mostly reasonable approach to JavaScript“. [3] Probably not a complete solution for all, but it’s a good place to start. In addition to these rules, you can add your own or even override them.

My favorite part about their documentation is where they explain why they have implemented specific rules.

You’ll likely need to install a few modules if you’re using Node.JS but these rules will get you started. [4] I use the ESLint extension published by Dirk Baeumer and have had no complaints. [5]

Finally, enforcing some new JavaScript conventions. Using keywords such as const and let instead of var. This allows the programmer to better describe the variable and define more specific scope. [6]

ESLint warning for using the 'var' keyword.

[1] – What is “Linting”? – https://stackoverflow.com/questions/8503559/what-is-linting

[2] – After 3 Months Of JavaScript Linting, It’s Pretty Much All Pain And No Gain – https://www.bennadel.com/blog/3312-after-3-months-of-javascript-linting-it-s-pretty-much-all-pain-and-no-gain.htm

[3] – Javascript Style Guide – https://github.com/airbnb/javascript

[4] – eslint-config-airbnb-base – https://www.npmjs.com/package/eslint-config-airbnb-base

[5] – ESLint – Visual Studio Marketplace – https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint

[6] – What’s the difference between using “let” and “var” to declare a variable? – https://stackoverflow.com/questions/762011/whats-the-difference-between-using-let-and-var-to-declare-a-variable

Leave a Reply

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