Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

JSHint Loader throwing an 'Unexpected end of JSON input' error on each Javascript file #9

Closed
johnmckay-reward opened this issue Jan 17, 2017 · 6 comments

Comments

@johnmckay-reward
Copy link

I have gotten as far as the Using Preloaders section in Basic Builds.

All going well until I add the preloader, at which point I see this:

webpack: bundle is now INVALID.
Hash: 1a3b5df408ee41c691bc
Version: webpack 1.14.0
Time: 5ms
chunk {0} bundle.js (main) 40 bytes
+ 1 hidden modules

ERROR in ./app.js
Module build failed: SyntaxError: Unexpected end of JSON input
at Object.parse (native)
at C:\Users\john\Desktop\Webpack\node_modules\jshint-loader\index.js:46:22
at tryToString (fs.js:455:3)
at FSReqWrap.readFileAfterClose [as oncomplete] (fs.js:442:12)
@ multi main

ERROR in ./utils.js
Module build failed: SyntaxError: Unexpected end of JSON input
at Object.parse (native)
at C:\Users\john\Desktop\Webpack\node_modules\jshint-loader\index.js:46:22
at tryToString (fs.js:455:3)
at FSReqWrap.readFileAfterClose [as oncomplete] (fs.js:442:12)
@ multi main

Utils.js literally looks like this:

console.log('utils loaded!');

App.js looks like this:

require('./login');

document.write('boom!!!');
console.log('kerplow!!!');

My webpack.config.js file looks like so:

module.exports = {
    entry: ["./utils","./app.js"],
    output: {
        filename: "bundle.js"
    },
    module: {
        preLoaders: [
            {
                test: /\.js$/,
                exclude: 'node_modules',
                loader: 'jshint-loader'
            }
        ],
        loaders: [
            {
                test: /\.es6$/,
                exclude: /node_modules/,
                loader: "babel-loader"
            }
        ]
    },
    resolve: {
        extensions: ['', '.js', '.es6']
    },
    watch: true
}

package.json looks like this, and I have run npm install sucessfully:

{
  "name": "learning-webpack",
  "version": "1.0.0",
  "description": "",
  "main": "app.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "babel-core": "^6.21.0",
    "babel-loader": "^6.2.10",
    "babel-preset-es2015": "^6.18.0",
    "jshint": "^2.9.4",
    "jshint-loader": "^0.8.3",
    "node-libs-browser": "^2.0.0",
    "webpack": "^1.14.0"
  }
}

If I remove the preloaders section, everything is fine.

I don't think I'm missing anything, but maybe I am? I am on Windows 10 Professional.

Thanks!

@zonender
Copy link

zonender commented Feb 8, 2017

I have the exact same issue, I hope Joe gets to look into this asap.

@zonender
Copy link

zonender commented Feb 8, 2017

Hey bumblebeeman

http://stackoverflow.com/questions/39668579/webpack-2-1-0-beta-25-error-unknown-property-postloaders

I hope this is useful to you, I tried implementing it but I am still getting:

"Unexpected end of JSON input"

error for both app.js and utils.js.

Regards

@zonender
Copy link

zonender commented Feb 8, 2017

I also tried this but still no luck:

this is the content of my webpack.config.js:

module.exports = {
entry: ["./utils", "./app.js"],
output: {
filename: "bundle.js"
},
watch: true,
module: {
rules: [
{
test: /.es6$/, //tests what kind of files to run/use through this loader
exclude: /node_modules/, //here we specify which files to exclude
loader: "babel-loader", //here we specifiy which loader we will user, from the package.json file
options: {
presets: ['es2015']
}
},
{
test: /.js$/, //tests what kind of files to run/use through this loader
exclude: /node_modules/, //here we specify which files to exclude
loader: "jshint-loader", //here we specifiy which loader we will user, from the package.json file
enforce: 'pre'
}
]
},
resolve: {
extensions: ['.js', '.es6']
}//here we specify which files we want to process without specifically giving them a file extension, by default
//webpack will assume all files not having an extension are js files, but here we tell webpack if it comes accross a file with no extensions also try these as well.
}

@zonender
Copy link

zonender commented Feb 8, 2017

I highly recommend this course: https://www.udemy.com/webpack-2-the-complete-developers-guide

At least it is up to date and the instructor actualy cares.

Regards

@jmccliment
Copy link
Contributor

It looks like the problem is actually with jshint-loader, not webpack itself. It's throwing a fit if .jshintrc is empty.

Putting an empty set of curly braces in .jshintrc fixed the problem for me.

jmccliment added a commit to jmccliment/WebpackFundamentalsCourse that referenced this issue Feb 17, 2017
joeeames added a commit that referenced this issue Feb 18, 2017
Updated README.md to address issue #9.
@joeeames
Copy link
Owner

Thanks for discovering this fix. I'll close the issue now.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

4 participants