Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

jshint-loader not working with webpack version 4

Tags:

webpack

Trying out & learn webpack & its fundamentals, with version-4. facing some issues with loaders & configuration

webpack configuration is as follows:

module.exports = {
  entry: ['./app.js', './util.js'],
  output: {
    filename: 'bundle.js'
  },
  module: {
    rules: [
      {
        test: /\.es6$/,
        exclude: /node_modules/,
        use: 'babel-loader'
      },
      {
        enforce: 'pre',
        test: /\.js$/,
        exclude: /node_modules/,
        use: 'jshint-loader'
      }
    ]
  },
  resolve: {
    extensions: ['.js', '.es6']
  }
}

upon webpack-dev-server, the error shows up, as follows:

ERROR in ./app.js
Module build failed: TypeError: Cannot read property 'jshint' of undefined
at Object.jsHint (/home/sagar/Documents/mine/gitrepo/webpack_illustration/node_modules/jshint-loader/index.js:63:17)
at Object.<anonymous> (/home/sagar/Documents/mine/gitrepo/webpack_illustration/node_modules/jshint-loader/index.js:149:11)
at /home/sagar/Documents/mine/gitrepo/webpack_illustration/node_modules/jshint-loader/index.js:55:5
at tryToString (fs.js:513:3)
at FSReqWrap.readFileAfterClose [as oncomplete] (fs.js:501:12)
@ multi (webpack)-dev-server/client?http://localhost:8080 ./app.js ./util.js
like image 891
harsha-sagar Avatar asked Mar 08 '18 16:03

harsha-sagar


1 Answers

Webpack 4 removed this.options in the loader context, jshint-loader just fixed this by removing the code. but there is no build in npm registry yet. you can pull the latest jshint-loader from GitHub, then using 'npm link'

or you can go to node_modules, find the jshint-loader, and modify the code from

function jsHint(input, options) {
    // copy options to own object
    if(this.options.jshint) {
        for(var name in this.options.jshint) {
            options[name] = this.options.jshint[name];
        }
    }

to

function jsHint(input, options) {
    // copy options to own object
    if(this.options && this.options.jshint) {
        for(var name in this.options.jshint) {
            options[name] = this.options.jshint[name];
        }
    }

please refer https://medium.com/webpack/webpack-4-migration-guide-for-plugins-loaders-20a79b927202

github fix: https://github.com/webpack-contrib/jshint-loader/blob/master/lib/index.js line 11

like image 159
Russel Yang Avatar answered Nov 15 '22 06:11

Russel Yang