- [Narrator] There are a number
of different JavaScript Linters
available that can be used to find suspicious code.
Believe it or not, you already have a linter installed.
Node.js has a built-in checker through the command line,
just type node dash dash check
and then the path to the file.
This checks for syntax errors in a single target file.
While this does have some utility,
like a quick one-off sanity check,
it doesn't scale to an entire project.
The three most common JavaScript Linters are,
JSLint, JSHint
and ESLint.
There all JavaScript syntax checkers and validators,
each of them supports ES6 standards at a minimum
and they're all free and open source software.
Let's take a closer look at each.
JSLint from jslint.com is by Douglas Crockford
author of the fantastic book ''JavaScript: The Good Parts''.
JSLint works well out of the box,
but that's both its power and its limitation.
There are very few configuration options,
you can't configure it with a file within a project
and you can't write custom rules
and there's limited documentation around rules and features.
With that said, it was the first JavaScript Linter
and all other tools have iterated on its success.
The next linter is JSHint from jshint.com.
It started as a fork of JSLint,
that made it more configurable.
In fact, every rule can be configured independently.
This facilitates the use of a configuration file
to use within projects, to standardize the testing.
It has a good amount of documentation,
but does not support custom rules or plugins.
In interesting note,
in 2020 it was relicensed to the MIT license,
making it truly open source.
Congratulations to the maintainers for coordinating that.
JSHint is fantastic, but not a complete solution.
ESLint from eslint.org,
uses the same core values as JSHint
and JSLint and removes the limitation.
It comes with scores of rules, including coding styles.
Similar to JSHint,
there's a lot of flexibility in rule configuration.
In fact, some rules have additional more granular settings,
if the defaults don't meet your needs.
Also similar to JSHint, ESLint can use a configuration file
that can be included within projects.
ESLint provides very comprehensive documentation
and is well supported.
ESLint is not limited to the functionality
that it chips with.
Unlike JSHint and JSLint,
ESLint can be extended with plugins.
This includes the ability to write custom rules
and ways of formatting reports.
ESLint also includes the ability
to automatically fix many problems that it detects,
which we'll talk about in greater detail
later in the chapter.
What are some of the open source projects that use ESLint?
This list may sound familiar Node.js, jQuery, Lodash,
React and webpack all use ESLint.
ESLint has incredibly broad adoption across the industry.
Another tool you may have heard about is prettier,
available from prettier.io.
Prettier in the words of their project page,
is an opinionated code formatter.
It's very fast as it does just one thing,
it automatically reformats your code.
Prettier is not a linter,
which means it's not looking for functional problems.
ESLint does some of the same code formatting,
but prettier goes a lot further.
Prettier can be used alongside ESLint in a configuration,
which delegates linting only to ESLint
and formatting to prettier.
I would like to make a distinction though,
Linting and code formatting are two different things.
Nicholas Zakas, the original author of ESLint said,
''I regret the part I played in devs thinking
that linters and code formatters are synonymous''.
Keep that in mind,
as you determine the tooling you want to use
for checking for code errors and formatting your code.
In this course,
I'm going to be using only ESLint for a number of reasons.
First it's currently the most popular JavaScript Linter,
ESLint is flexible in both the configuration
and the ability to add custom functionality.
ESLint can both lint and correct formatting
and fix problems in one tool,
which overall simplifies configuration and support.
Finally, ESLint has the best documentation
and community support of all the available Linters.
It's good to know what's available
and make an informed decision.
So how do we go about adding ESLint to our project?