javascript - npm run dev not working - Stack Overflow

I have a problem with vueJs webpack, I want to run on the server, with a mand: npm run dev. But I get some error message as below.

Could anyone tell me how do I solve it?? Thank you very much!

Error message

npm ERR! code EJSONPARSE

npm ERR! Failed to parse json

npm ERR! Unexpected token / while parsing '{

npm ERR! "name": "vue-loader-demo",

npm ERR! "versio'

npm ERR! File: /Users/sylvia/Documents/FE/Practice/vue/vue-loader-

demo/package.json

npm ERR! Failed to parse package.json data.

npm ERR! package.json must be actual JSON, not just JavaScript.

npm ERR! npm ERR! Tell the package author to fix their package.json file.

JSON.parse

npm ERR! A plete log of this run can be found in:

npm ERR! /Users/sylvia/.npm/_logs/2018-04-17T12_39_56_372Z-debug.log

Here is the package.json

{
 "name": "vue-loader-demo",
 "version": "1.0.0",
 "description": "",
 "main": "main.js",
 "scripts": {
    "build": "webpack",
    "dev": "webpack-dev-server --devtool eval --progress --colors --hot" 
  },
  "author": "",
  "license": "ISC",
  "dependencies": {
    "webpack": "^4.5.0",
    "webpack-dev-server": "^3.1.3"
  }
}

webpack.config.js

module.exports={

entry:'./main.js',

output:{

 path:_dirname，

 filename:‘'bundle.js'’

} }

File structure

|-index.html

|-main.js

|-App.vue

|-package.json

|-webpack.config.js

I have a problem with vueJs webpack, I want to run on the server, with a mand: npm run dev. But I get some error message as below.

Could anyone tell me how do I solve it?? Thank you very much!

Error message

npm ERR! code EJSONPARSE

npm ERR! Failed to parse json

npm ERR! Unexpected token / while parsing '{

npm ERR! "name": "vue-loader-demo",

npm ERR! "versio'

npm ERR! File: /Users/sylvia/Documents/FE/Practice/vue/vue-loader-

demo/package.json

npm ERR! Failed to parse package.json data.

npm ERR! package.json must be actual JSON, not just JavaScript.

npm ERR! npm ERR! Tell the package author to fix their package.json file.

JSON.parse

npm ERR! A plete log of this run can be found in:

npm ERR! /Users/sylvia/.npm/_logs/2018-04-17T12_39_56_372Z-debug.log

Here is the package.json

{
 "name": "vue-loader-demo",
 "version": "1.0.0",
 "description": "",
 "main": "main.js",
 "scripts": {
    "build": "webpack",
    "dev": "webpack-dev-server --devtool eval --progress --colors --hot" 
  },
  "author": "",
  "license": "ISC",
  "dependencies": {
    "webpack": "^4.5.0",
    "webpack-dev-server": "^3.1.3"
  }
}

webpack.config.js

module.exports={

entry:'./main.js',

output:{

 path:_dirname，

 filename:‘'bundle.js'’

} }

File structure

|-index.html

|-main.js

|-App.vue

|-package.json

|-webpack.config.js

• javascript
• npm
• webpack
• vue.js

Share Improve this question Follow edited Apr 17, 2018 at 13:42 Sylvia asked Apr 17, 2018 at 12:56 SylviaSylvia 27722 gold badges66 silver badges1616 bronze badges 6

• 1 Seems to be some problem with package.json, recheck the file – Abhay Srivastav Commented Apr 17, 2018 at 13:00
• It might be that there's a problem with your webpack.config.js file. Could you try posting this for us to see? – Alex Mulchinock Commented Apr 17, 2018 at 13:37
• @Alex Mulchinock Here is the webpack.config.js file module.exports={ entry:'./main.js', output:{ path:_dirname， filename:‘'bundle.js'’ } } – Sylvia Commented Apr 17, 2018 at 13:39
• Please add code to your question. It's difficult to read in ments! – Alex Mulchinock Commented Apr 17, 2018 at 13:41
• 1 filename:‘'bundle.js'’ doesn't look right. – ceejayoz Commented Apr 17, 2018 at 13:44

 |  Show 1 more ment

5 Answers 5

Sorted by: Reset to default 3

I suspect the issue you're having is caused by the additional backticks in your webpack.config.js file.

Change this: filename:‘'bundle.js'’ To this: filename:'bundle.js'

Assuming I am correct - an error triggered here will cause the script referenced in the package.json to fail, which would result in webpack no longer seeing valid JSON (as it is seeing part JSON, part error).

This would potentially explain the "npm ERR! package.json must be actual JSON, not just JavaScript." error message in your log.

Try this mand:

sudo npm run dev

Here's what just fixed it for me: Make sure your current directory is correct. When running create next / react / vue apps they will create a new folder in which your package.json file / scripts (and every other important file) are located, be sure to cd into that folder before running npm run dev.

I used http://package-json-validator./ to check your file, problem is author cannot be empty: errors:["author field should have name"]

Follow these steps as npm install && npm run dev is not working in laravel

1. poser require laravel/ui --dev
2. npm install
3. npm run dev

Do not use npm install && npm run dev

and if you have another problem go to path and change this

C:\Program Files\nodejs\node_modules\npm\bin