Mike Slinn
Mike Slinn

JavaScript Linter Configuration

Published 2021-02-08.
Time to read: about 2 minutes.

This article is categorized under Atom, ECMAScript, JavaScript, Jekyll.

Using a lint tool can really help improve your code in a hurry. I am using JSHint for a project that has a big JavaScript file that needs some love.

.jshintrc

All modern web browsers support at least the version of JavaScript that conforms to ECMAScript 6th Edition, also known as ECMAScript 2015. Neither the documentation for the Atom linter-jshint plugin nor JSHint itself explicitly state that in order to work with the version of JavaScript supported by all modern web browsers, you need to provide a JSON formatted configuration file that sets the esversion property to 6, like this:

.jshintrc
{
  "esversion": 6
}

If you do not do this, then JSHint will indicate errors if it encounters class definitions, for example.

I put .jshintrc in the top-level directory of my project.

I created a pull request for the `linter-jshint` GitHub project so this documentation would be included.

Reading from stdin

The JSHint CLI docs say:

If a file path is a dash (-) then JSHint will read from standard input.

I needed to preprocess my JavaScript source files before invoking JSHint. Because JSHint can read from standard input, there is no need to write the preprocessed file contents to a temporary file.

Removing Jekyll Front Matter for JSHint

Jekyll can process any text file, including JavaScript files, if they contain front matter markers. This is useful for invoking Jekyll plugins and/or using Liquid expressions. My big JavaScript file has some information injected into it when Jekyll generates the site.

Front matter is marked (delimited by) by two lines at the top of a file, consisting of three dashes, like this:

---
---

Here is how the empty front matter can be stripped from myfile.js so JSHint can inspect the remaining lines:

Shell
$ sed '/---/d' < myfile.js | jshint -