Last modified: November 27, 2017
Linting is the process of checking code for potential bugs or issues. Linters are used to ensure that a project adheres to coding standards specified by a user or organization. When you run your code through a linter, it throws warnings for things like unintended global variables, code style, and code consistency.
Linters work by parsing code and analyzing it for styling inconsistencies and potential bugs. Linters throw warnings based on a set of rules defining best practices or a particular coding style. Most popular JS linters have online versions where you can simply copy / paste your code to generate warnings. Alternatively, you can run JS files through linters via task runners like gulp, etc. Linter utilities can be installed with package managers like npm. Linters can also integrate with IDEs like Atom and WebStorm to dynamically throw warnings as code is produced. This achieves a similar effect to modern compilers that throw warnings and catch errors before and during compile time.
Linters typically require a certain configuration that specifies a set of rules to check for. Since things like tabs vs spaces and semicolons are largely a matter of personal preference, different presets and configurations are used based on a team's preferences. This helps developers conform to a specific style and ensures consistency for a team or organization. While most linters come with a predefined set of rules to check for, they are easily extensible and can be customized to fit a team’s preferences. Companies like AirBnB and Google also provide their own presets that can be used with popular linter tools like ESHint.
JSHint is a more configurable version of JSLint. In fact, JSHint is a fork of the original JSLint project. JSHint has the added advantage of configuration and extensibility. It has better documentation and supports ES6 but not React.
JSCS is a bit different than JSHint in that it only catches issues related to formatting. Unlike JSHint, JSCS does not catch potential errors or bugs for things like unused variables or globals. JSCS does require a configuration file but comes with convenient presets. JSCS is great for coding style specifically.
ESLint is the most recent and popular linter used today. It's easily extensible and has the best support for ES6. ESLint also supports JSX, making it very popular with the React community. ESLint is superior for its ability to detect problems and has more rules available than other linters. While it does require configuration, ESLint has many presets available that make getting started a breeze.