Unable to start webpack-dev-server - npm

Question

I am attempting to do a React tutorial, and although I have downloaded files from the instructor, I am unable to start the web-dev-server on my laptop. I can, however, get it to work on my desktop computer. I will need to be able to work on my laptop, though, so I would appreciate any help in figuring out what's wrong. I have tried deleting and re-installing the the node_modules folder (many times), as well as deleting just the webpack-dev-server folder and re-installing that. As far as I can tell no other program is using the same port (8080).
Here is the error log I get:
0 info it worked if it ends with ok
1 verbose cli [ '/usr/local/bin/node', '/usr/local/bin/npm', 'start' ]
2 info using npm#6.4.0
3 info using node#v8.11.3
4 verbose run-script [ 'prestart', 'start', 'poststart' ]
5 info lifecycle github-battle#1.0.0~prestart: github-battle#1.0.0
6 info lifecycle github-battle#1.0.0~start: github-battle#1.0.0
7 verbose lifecycle github-battle#1.0.0~start: unsafe-perm in lifecycle true
8 verbose lifecycle github-battle#1.0.0~start: PATH: /usr/local/lib/node_modules/npm/node_modules/npm-lifecycle/node-gyp-bin:/Users/eleerogers/Downloads/react-fundamentals-first-component/node_modules/.bin:/usr/local/bin:/usr/bin:/bin:/usr/sbin:/sbin
9 verbose lifecycle github-battle#1.0.0~start: CWD: /Users/eleerogers/Downloads/react-fundamentals-first-component
10 silly lifecycle github-battle#1.0.0~start: Args: [ '-c', 'webpack-dev-server --open' ]
11 silly lifecycle github-battle#1.0.0~start: Returned: code: 1 signal: null
12 info lifecycle github-battle#1.0.0~start: Failed to exec start script
13 verbose stack Error: github-battle#1.0.0 start: `webpack-dev-server --open`
13 verbose stack Exit status 1
13 verbose stack at EventEmitter.<anonymous> (/usr/local/lib/node_modules/npm/node_modules/npm-lifecycle/index.js:304:16)
13 verbose stack at emitTwo (events.js:126:13)
13 verbose stack at EventEmitter.emit (events.js:214:7)
13 verbose stack at ChildProcess.<anonymous> (/usr/local/lib/node_modules/npm/node_modules/npm-lifecycle/lib/spawn.js:55:14)
13 verbose stack at emitTwo (events.js:126:13)
13 verbose stack at ChildProcess.emit (events.js:214:7)
13 verbose stack at maybeClose (internal/child_process.js:925:16)
13 verbose stack at Process.ChildProcess._handle.onexit (internal/child_process.js:209:5)
14 verbose pkgid github-battle#1.0.0
15 verbose cwd /Users/eleerogers/Downloads/react-fundamentals-first-component
16 verbose Darwin 17.7.0
17 verbose argv "/usr/local/bin/node" "/usr/local/bin/npm" "start"
18 verbose node v8.11.3
19 verbose npm v6.4.0
20 error code ELIFECYCLE
21 error errno 1
22 error github-battle#1.0.0 start: `webpack-dev-server --open`
22 error Exit status 1
23 error Failed at the github-battle#1.0.0 start script.
23 error This is probably not a problem with npm. There is likely additional logging output above.
24 verbose exit [ 1, true ]
Here is the webpack.config.js:
var path = require('path');
var HtmlWebpackPlugin = require('html-webpack-plugin');
module.exports = {
entry: './app/index.js',
output: {
path: path.resolve(__dirname, 'dist'),
filename: 'index_bundle.js'
},
module: {
rules: [
{ test: /\.(js)$/, use: 'babel-loader' },
{ test: /\.css$/, use: [ 'style-loader', 'css-loader' ]}
]
},
plugins: [
new HtmlWebpackPlugin({
template: 'app/index.html'
})
],
mode: "development"
};
And here is the package.json:
{
"name": "github-battle",
"version": "1.0.0",
"description": "Project for TylerMcGinnis.com's fundamental course.",
"main": "index.js",
"scripts": {
"start": "webpack-dev-server --open"
},
"author": "Tyler McGinnis",
"license": "MIT",
"babel": {
"presets": [
"env",
"react"
]
},
"dependencies": {
"react": "^16.0.0-alpha.5",
"react-dom": "^16.0.0-alpha.5"
},
"devDependencies": {
"babel-core": "^6.26.3",
"babel-loader": "^7.1.4",
"babel-plugin-transform-async-to-generator": "^6.24.1",
"babel-preset-env": "^1.7.0",
"babel-preset-react": "^6.24.1",
"css-loader": "^0.28.11",
"html-webpack-plugin": "^3.2.0",
"style-loader": "^0.21.0",
"webpack": "^4.8.3",
"webpack-cli": "^2.1.4",
"webpack-dev-server": "^3.1.5"
}
}
Although, as I said, it works on my desktop, so I don't think it's anything wrong with those... something is going on with my laptop. It is a new Macbook Air. Thanks for any help!

Answer 1

npm clean cache
then
npm install
This should solve your problem.