W3cubDocs

/webpack

jshint-loader

Runs JSHint on required JavaScript files.

Install

npm i jshint-loader --save

Usage

Apply the jshint loader in your webpack configuration:

module.exports = {
    module: {
        rules: [
            {
                test: /\.js$/, // include .js files
                enforce: "pre", // preload the jshint loader
                exclude: /node_modules/, // exclude any and all files in the node_modules folder
                use: [
                    {
                        loader: "jshint-loader"
                    }
                ]
            }
        ]
    },

    // more options in the optional jshint object
    jshint: {
        // any jshint option http://www.jshint.com/docs/options/
        // i. e.
        camelcase: true,

        // jshint errors are displayed by default as warnings
        // set emitErrors to true to display them as errors
        emitErrors: false,

        // jshint to not interrupt the compilation
        // if you want any file with jshint errors to fail
        // set failOnHint to true
        failOnHint: false,

        // custom reporter function
        reporter: function(errors) { }
    }
}

Custom reporter

By default, jshint-loader will provide a default reporter.

However, if you prefer a custom reporter, pass a function under the reporter key in jshint options. (see usage above)

The reporter function will be passed an array of errors/warnings produced by jshint with the following structure:

[
{
    id:        [string, usually '(error)'],
    code:      [string, error/warning code],
    reason:    [string, error/warning message],
    evidence:  [string, a piece of code that generated this error]
    line:      [number]
    character: [number]
    scope:     [string, message scope;
                usually '(main)' unless the code was eval'ed]

    [+ a few other legacy fields that you don't need to worry about.]
},
// ...
// more errors/warnings
]

The reporter function will be excuted with the loader context as this. You may emit messages using this.emitWarning(...) or this.emitError(...). See webpack docs on loader context.

Note: jshint reporters are not compatible with jshint-loader! This is due to the fact that reporter input is only processed from one file; not multiple files. Error reporting in this manner differs from traditional reporters for jshint since the loader plugin (i.e. jshint-loader) is executed for each source file; and thus the reporter is executed for each file.

The output in webpack CLI will usually be:

...

WARNING in ./path/to/file.js
<reporter output>

...

`

© JS Foundation and other contributors
Licensed under the Creative Commons Attribution License 4.0.
https://webpack.js.org/loaders/jshint-loader