JSHint

What JSHint is

JSHint is a "code linting library", that is, it parses your JavaScript code and warns you when something seems off. It is primarily used to catch syntax errors, but it can also enforce stylistic choices. The former, catching syntax errors, is a real time saver, and no JS developer worth his salt would ever want to work without JSHint or an equivalent library.

The latter, enforcing certain coding styles, becomes important in a collaborative project where many chefs are stirring the same soup, all having their individual styles and preferences.

JSHint can be configured using a special comment block at the top of the file to be parsed, but more commonly the settings are store in a separate file named .jshintrc which is stored at the root of the project. Most modern editors will then automatically find the file and apply it to all JavaScript files in the project.

An example

Here's an example of a .jshintrc-file. As you can see it is a simple JSON object where the keys are the different JSHint options. Most of them are simply set to true, while a few take a number value.

It is not necessary to include a setting just to set it to false, as is the case for some settings below. The reason to do that is probably to make it easier to turn the setting back on should the user later on wish to do so.

{
    "maxparams": 5,
    "maxdepth": 5,
    "maxstatements": 25,
    "maxcomplexity": 10,
    "node": true,
    "browser": true,
    "boss": false,
    "curly": true,
    "debug": false,
    "devel": false,
    "eqeqeq": true,
    "evil": true,
    "forin": false,
    "immed": true,
    "laxbreak": false,
    "newcap": false,
    "noarg": true,
    "noempty": true,
    "nomen": false,
    "onevar": true,
    "plusplus": true,
    "regexp": false,
    "undef": true,
    "sub": true,
    "strict": false,
    "white": true,
    "unused": true,
    "nonew": true,
    "bitwise": true,
    "latedef": true,
    "nonbsp": true
}

Using JSHint in the course

Unlike in previous iterations of the course, using JSHint is not mandatory. If you do use it, please present the contents of your .jshintrc-file in a blog post and explain your choices.

And even if you don't "officially" use JSHint you are strongly recommended to make sure you have some kind of syntax checker in your editor, especially if you are somewhat new to coding with JavaScript. This will save you lots and lots of time.

What style rules should I use?

This is entirely up to you! However, we'd like to make two recommendations:

  • The newcap setting (which makes you have to use new when invoking a function starting with a capital letter) should be false, or JSHint might choke on the JSX-compiled code.
  • It is a very good idea to use the complexity dampening settings maxparams, maxdepth, maxstatements and maxcomplexity! You can read up on them here.

Other options

There are other linting solutions out there. The most viable alternatives are perhaps ESLint and the original JSLint.

Welcome to CoursePress

en utav Linnéuniversitets lärplattformar. Som inloggad student kan du kommunicera, hålla koll på dina kurser och mycket mer. Du som är gäst kan nå de flesta kurser och dess innehåll utan att logga in.

Läs mer lärplattformar vid Linnéuniversitetet

Student account

To log in you need a student account at Linnaeus University.

Read more about collecting your account

Log in LNU