Webpack: Bug with webpack-dev-server 2.10.0 - Unable to start webpack-dev-server
Anyone else getting these error messages after running npm start when initing webpack project? 😕
$ npm start
> [email protected] start /path/to/project
> npm run dev
> [email protected] dev /path/to/project
> webpack-dev-server --inline --progress --config build/webpack.dev.conf.js
webpack-dev-server 2.10.0
webpack 3.10.0
Usage: https://webpack.js.org/configuration/dev-server/
Config options:
--config Path to the config file
[string] [default: webpack.config.js or webpackfile.js]
--config-name Name of the config to use [string]
--env Environment passed to the config, when it is a function
Basic options:
--context The root directory for resolving entry point and stats
[string] [default: The current directory]
--entry The entry point [string]
--watch, -w Watch the filesystem for changes [boolean]
--debug Switch loaders to debug mode [boolean]
--devtool Enable devtool for better debugging experience (Example:
--devtool eval-cheap-module-source-map) [string]
-d shortcut for --debug --devtool eval-cheap-module-source-map
--output-pathinfo [boolean]
-p shortcut for --optimize-minimize --define
process.env.NODE_ENV="production" [boolean]
--progress Print compilation progress in percentage [boolean]
Module options:
--module-bind Bind an extension to a loader [string]
--module-bind-post [string]
--module-bind-pre [string]
Output options:
--output-path The output path for compilation assets
[string] [default: The current directory]
--output-filename The output filename of the bundle
[string] [default: [name].js]
--output-chunk-filename The output filename for additional chunks
[string] [default: filename with [id] instead of [name] or [id] prefixed]
--output-source-map-filename The output filename for the SourceMap [string]
--output-public-path The public path for the assets [string]
--output-jsonp-function The name of the jsonp function used for chunk
loading [string]
--output-pathinfo Include a comment with the request for every
dependency (require, import, etc.) [boolean]
--output-library Expose the exports of the entry point as library
[string]
--output-library-target The type for exposing the exports of the entry
point as library [string]
Advanced options:
--records-input-path Path to the records file (reading) [string]
--records-output-path Path to the records file (writing) [string]
--records-path Path to the records file [string]
--define Define any free var in the bundle [string]
--target The targeted execution environment [string]
--cache Enable in memory caching
[boolean] [default: It's enabled by default when watching]
--watch-stdin, --stdin close when stdin ends [boolean]
--watch-aggregate-timeout Timeout for gathering changes while watching
--watch-poll The polling interval for watching (also enable
polling) [string]
--hot Enables Hot Module Replacement [boolean]
--prefetch Prefetch this request (Example: --prefetch
./file.js) [string]
--provide Provide these modules as free vars in all modules
(Example: --provide jQuery=jquery) [string]
--labeled-modules Enables labeled modules [boolean]
--plugin Load this plugin [string]
--bail Abort the compilation on first error
[boolean] [default: null]
--profile Profile the compilation and include information in
stats [boolean] [default: null]
--hot-only Do not refresh page if HMR fails [boolean]
Resolving options:
--resolve-alias Setup a module alias for resolving (Example:
jquery-plugin=jquery.plugin) [string]
--resolve-extensions Setup extensions that should be used to resolve
modules (Example: --resolve-extensions .es6,.js)
[array]
--resolve-loader-alias Setup a loader alias for resolving [string]
Optimizing options:
--optimize-max-chunks Try to keep the chunk count below a limit
--optimize-min-chunk-size Try to keep the chunk size above a limit
--optimize-minimize Minimize javascript and switches loaders to
minimizing [boolean]
Stats options:
--color, --colors Enables/Disables colors on the console
[boolean] [default: (supports-color)]
--info Info [boolean] [default: true]
--quiet Quiet [boolean]
--client-log-level Log level in the browser (info, warning, error or none)
[string] [default: "info"]
SSL options:
--https HTTPS [boolean]
--key Path to a SSL key. [string]
--cert Path to a SSL certificate. [string]
--cacert Path to a SSL CA certificate. [string]
--pfx Path to a SSL pfx file. [string]
--pfx-passphrase Passphrase for pfx file. [string]
Response options:
--content-base A directory or URL to serve HTML content from.[string]
--watch-content-base Enable live-reloading of the content-base. [boolean]
--history-api-fallback Fallback to /index.html for Single Page Applications.
[boolean]
--compress Enable gzip compression [boolean]
Connection options:
--port The port
--disable-host-check Will not check the host [boolean]
--socket Socket to listen
--public The public hostname/ip address of the server [string]
--host The hostname/ip address the server will bind to
[string] [default: "localhost"]
--allowed-hosts A comma-delimited string of hosts that are allowed to
access the dev server [string]
Options:
--help, -h Show help [boolean]
--version Show version number [boolean]
--bonjour Broadcasts the server via ZeroConf networking on start [boolean]
--lazy Lazy [boolean]
--inline Inline mode (set to false to disable including client scripts
like livereload) [boolean] [default: true]
--open Open the default browser, or optionally specify a browser name
[string]
--useLocalIp Open default browser with local IP [boolean]
--open-page Open default browser with the specified page [string]
Missing argument values: config-name, context, entry, module-bind, module-bind-post, module-bind-pre, output-path, output-filename, output-chunk-filename, output-source-map-filename, output-public-path, output-jsonp-function, output-library, output-library-target, records-input-path, records-output-path, records-path, define, target, watch-aggregate-timeout, devtool, resolve-alias, resolve-extensions, resolve-loader-alias, optimize-max-chunks, optimize-min-chunk-size, prefetch, provide, plugin, open-page
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected] dev: `webpack-dev-server --inline --progress --config build/webpack.dev.conf.js`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] dev script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
npm ERR! A complete log of this run can be found in:
npm ERR! /path/to/error/log
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected] start: `npm run dev`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] start script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
npm ERR! A complete log of this run can be found in:
npm ERR! /path/to/error/logs
Npm logs output:
0 info it worked if it ends with ok
1 verbose cli [ '/path/to/node',
1 verbose cli '/path/to/node',
1 verbose cli 'run',
1 verbose cli 'dev' ]
2 info using [email protected]
3 info using [email protected]
4 verbose run-script [ 'predev', 'dev', 'postdev' ]
5 info lifecycle [email protected]~predev: [email protected]
6 info lifecycle [email protected]~dev: [email protected]
7 verbose lifecycle [email protected]~dev: unsafe-perm in lifecycle true
8 verbose lifecycle [email protected]~dev: PATH: $PATH
9 verbose lifecycle [email protected]~dev: CWD: /path/to/project
10 silly lifecycle [email protected]~dev: Args: [ '-c',
10 silly lifecycle 'webpack-dev-server --inline --progress --config build/webpack.dev.conf.js' ]
11 silly lifecycle [email protected]~dev: Returned: code: 1 signal: null
12 info lifecycle [email protected]~dev: Failed to exec dev script
13 verbose stack Error: [email protected] dev: `webpack-dev-server --inline --progress --config build/webpack.dev.conf.js`
13 verbose stack Exit status 1
13 verbose stack at EventEmitter.<anonymous> (/path/to/node)
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> (/path/to/spawn: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 [email protected]
15 verbose cwd /path/to/project
16 verbose Darwin 17.3.0
17 verbose argv "/path/to/node" "/path/to/npm" "run" "dev"
18 verbose node v8.9.1
19 verbose npm v5.6.0
20 error code ELIFECYCLE
21 error errno 1
22 error [email protected] dev: `webpack-dev-server --inline --progress --config build/webpack.dev.conf.js`
22 error Exit status 1
23 error Failed at the [email protected] dev script.
23 error This is probably not a problem with npm. There is likely additional logging output above.
24 verbose exit [ 1, true ]
Node version
$ node -v
v8.9.1
Webpack and webpack-dev-server works fine in other projects locally. Pretty stumped on this issue. Thanks!
NigelEarle
All 23 comments
I'm having the same problem too !
ZeroX-DG
on 7 Jan 2018
Look like the problem is in the newest version of webpack dev server
https://github.com/webpack/webpack-dev-server/issues/1259
ZeroX-DG
on 7 Jan 2018
I too am getting this same error. Was working fine a few days ago
lsbyerley
on 7 Jan 2018
Thanks @ZeroX-DG just downgraded webpack-dev-server to v2.9.7. Works great now!
NigelEarle
on 8 Jan 2018
I'm having the same problem too ! !!!!!!!!!!!!!!!
justleolee
on 9 Jan 2018
@NigelEarle @ZeroX-DG run this command in my project works great too,Thanks!!!
npm install [email protected] --save-dev
and change webpack.dev.conf.js devServer options
devServer:{
inline:false,
...
}
CocoChen917
on 9 Jan 2018
@CocoChen917 Thanks!
NovoManu
on 9 Jan 2018
Someone found a solution to the problem?
chabanov
on 9 Jan 2018
The problem is in the newest version of webpack dev server (2.10.0)
See: https://github.com/webpack/webpack-dev-server/issues/1259
Right now a simple work around solution is to downgrade to an older version of webpack dev server using the command
npm install [email protected] --save-dev
Or if you're using yarn
yarn add -D [email protected]
I am facing the same issue. Please post a solution once it is available. Thanks.
srihari-sridharan
on 10 Jan 2018
The problem have been resolved, you can now upgrade to the newest version of webpack (2.10.1).
See: https://github.com/webpack/webpack-dev-server/issues/1259
ZeroX-DG
on 10 Jan 2018
For those who still stuck on this issue even after changing their version of node and npm, adding this line in my hosts file has solved the problem:
127.0.0.1 localhost
loicsalzmann
on 29 Aug 2018
sudo npm run serve worked for me in vue-cli 3.0.5
khalilst
on 27 Oct 2018
thank you, this helped
takaroo
on 16 Dec 2018
Problem solved with npm install [email protected] --save-dev
JoeFu
on 24 Feb 2019
This worked like a charm! Thank you!
gspiller67
on 10 Mar 2019
Still getting this issue with the latest version of webpack-dev-server and no luck after downgrading to webpack-dev-server 2.9.7 or with any fixes shown above.
log:
0 info it worked if it ends with ok
1 verbose cli [ '/usr/local/bin/node', '/usr/local/bin/npm', 'run', 'dev' ]
2 info using [email protected]
3 info using [email protected]
4 verbose run-script [ 'predev', 'dev', 'postdev' ]
5 info lifecycle [email protected]~predev: [email protected]
6 info lifecycle [email protected]~dev: [email protected]
7 verbose lifecycle [email protected]~dev: unsafe-perm in lifecycle true
8 verbose lifecycle [email protected]~dev: PATH: /usr/local/lib/node_modules/npm/node_modules/npm-lifecycle/node-gyp-bin:/usr/home/test/BioPlate/app/client/node_modules/.bin:/sbin:/bin:/usr/sbin:/usr/bin:/usr/local/sbin:/usr/local/bin:/root/bin
9 verbose lifecycle [email protected]~dev: CWD: /usr/home/test/BioPlate/app/client
10 silly lifecycle [email protected]~dev: Args: [ '-c',
10 silly lifecycle 'webpack-dev-server --inline --progress --config build/webpack.dev.conf.js' ]
11 silly lifecycle [email protected]~dev: Returned: code: 1 signal: null
12 info lifecycle [email protected]~dev: Failed to exec dev script
13 verbose stack Error: [email protected] dev: webpack-dev-server --inline --progress --config build/webpack.dev.conf.js
13 verbose stack Exit status 1
13 verbose stack at EventEmitter.
13 verbose stack at EventEmitter.emit (events.js:197:13)
13 verbose stack at ChildProcess.
13 verbose stack at ChildProcess.emit (events.js:197:13)
13 verbose stack at maybeClose (internal/child_process.js:984:16)
13 verbose stack at Process.ChildProcess._handle.onexit (internal/child_process.js:265:5)
14 verbose pkgid [email protected]
15 verbose cwd /usr/home/test/BioPlate/app/client
16 verbose FreeBSD 12.0-RELEASE-p3
17 verbose argv "/usr/local/bin/node" "/usr/local/bin/npm" "run" "dev"
18 verbose node v11.11.0
19 verbose npm v6.4.1
20 error code ELIFECYCLE
21 error errno 1
22 error [email protected] dev: webpack-dev-server --inline --progress --config build/webpack.dev.conf.js
22 error Exit status 1
23 error Failed at the [email protected] dev script.
23 error This is probably not a problem with npm. There is likely additional logging output above.
24 verbose exit [ 1, true ]
jecker7
on 27 Mar 2019
Still an issue, but https://github.com/vuejs-templates/webpack/issues/1229#issuecomment-356576873 helped
DobroAlex
on 31 Jul 2019
Try unset HOST, this one helps me
yasmineTYM
on 21 Feb 2020
C:\Users\Shakil Talukder\Desktop\bootsratp-webpack\node_modules\webpack-cli\bin\cli.js:93
throw err;
^
ReferenceError: options is not defined
at Object.
at Module._compile (C:\Users\Shakil Talukder\Desktop\bootsratp-webpack\node_modules\v8-compile-cache\v8-compile-cache.js:192:30)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:991:10)
at Module.load (internal/modules/cjs/loader.js:811:32)
at Function.Module._load (internal/modules/cjs/loader.js:723:14)
at Module.require (internal/modules/cjs/loader.js:848:19)
at require (C:\Users\Shakil Talukder\Desktop\bootsratp-webpack\node_modules\v8-compile-cache\v8-compile-cache.js:161:20)
at WEBPACK_OPTIONS (C:\Users\Shakil Talukder\Desktop\bootsratp-webpack\node_moduleswebpack-cli\bin\utils\convert-argv.js:114:13)
at requireConfig (C:\Users\Shakil Talukder\Desktop\bootsratp-webpack\node_moduleswebpack-cli\bin\utils\convert-argv.js:116:6)
at C:\Users\Shakil Talukder\Desktop\bootsratp-webpack\node_moduleswebpack-cli\bin\utils\convert-argv.js:123:17
at Array.forEach (
at module.exports (C:\Users\Shakil Talukder\Desktop\bootsratp-webpack\node_moduleswebpack-cli\bin\utils\convert-argv.js:121:15)
at C:\Users\Shakil Talukder\Desktop\bootsratp-webpack\node_moduleswebpack-cli\bin\cli.js:71:45
at Object.parse (C:\Users\Shakil Talukder\Desktop\bootsratp-webpack\node_moduleswebpack-cli\node_modules\yargs\yargs.js:567:18)
at C:\Users\Shakil Talukder\Desktop\bootsratp-webpack\node_moduleswebpack-cli\bin\cli.js:49:8
at Object.
at Module._compile (internal/modules/cjs/loader.js:955:30)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:991:10)
at Module.load (internal/modules/cjs/loader.js:811:32)
at Function.Module._load (internal/modules/cjs/loader.js:723:14)
at Module.require (internal/modules/cjs/loader.js:848:19)
at require (internal/modules/cjs/helpers.js:74:18)
at Object.
at Module._compile (internal/modules/cjs/loader.js:955:30)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:991:10)
at Module.load (internal/modules/cjs/loader.js:811:32)
at Function.Module._load (internal/modules/cjs/loader.js:723:14)
at Function.Module.runMain (internal/modules/cjs/loader.js:1043:10)
at internal/main/run_main_module.js:17:11
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected] build: webpack
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] build script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\Shakil Talukder\AppData\Roaming\npm-cache_logs\2020-05-24T18_35_18_165Z-debug.log
MohammadShakilCSE
on 24 May 2020
i face problem reload webpack live server
MohammadShakilCSE
on 24 May 2020
Solved Here Solved on 14 May 2021
First of all, you have installed webpack, webpack-cli and webpack-dev-server the wrong way. You made them dependencies and not devDependencies. To change that, uninstall them:
npm uninstall webpack webpack-cli webpack-dev-server
and then install them properly:
npm install webpack webpack-cli webpack-dev-server --save-dev
And I found a solution that adding a new script or in your Start Script in package.json worked for me. So you can try this way as well.
"scripts": {
"dev": "webpack serve --mode development --env development"
}
And add this snippet in your webpack.config.js file [ contentBase is directory of your index.html file ].
module.exports = {
devServer : {
contentBase : __dirname + '/public',
inline : false,
},
}
Finally run this on your terminal
npm run dev
If you have any queries then reply to this comment.
tejas100
on 14 May 2021
Tejas100 we have a subsequent issue.
[email protected] dev C:\Users\nattn\Desktop\fingz\front
webpack serve --mode development --env development
i ï½¢wdsï½£: Project is running at http://localhost:8080/
i ï½¢wdsï½£: webpack output is served from /
i ï½¢wdsï½£: Content not from webpack is served from C:\Users\nattn\Desktop\fingz\front
i ï½¢wdmï½£: asset main.js 429 KiB [emitted] (name: main)
runtime modules 1.25 KiB 6 modules
modules by path ./node_modules/ 377 KiB
modules by path ./node_modules/axios/ 41.3 KiB 27 modules
modules by path ./node_modules/webpack-dev-server/client/
20.9 KiB 10 modules
modules by path ./node_modules/html-entities/lib/.js 61 KiB 5 modules
modules by path ./node_modules/webpack/hot/ 1.58 KiB 3 modules
modules by path ./node_modules/url/ 37.4 KiB 3 modules
modules by path ./node_modules/querystring/.js 4.51 KiB 3 modules
modules by path ./src/ 2.89 KiB
modules by path ./src/screens/.js 1.88 KiB 3 modules
modules by path ./src/.js 1.01 KiB
./src/index.js 791 bytes [built] [code generated]
./src/utils.js 245 bytes [built] [code generated]
webpack 5.37.1 compiled successfully in 553 ms
i ï½¢wdmï½£: Compiled successfully.
for some reason
webpack serve --mode development --env development
wont render the frontend script now that data.js has been moved to backend?
NathanBrews
on 24 May 2021
Related issues
SSmale
·
3Comments
divyanthj
·
3Comments
connor11528
·
3Comments
rkrejcii
·
4Comments
jlucrob
·
3Comments
Most helpful comment
@NigelEarle @ZeroX-DG run this command in my project works great too,Thanks!!!
npm install [email protected] --save-dev
and change webpack.dev.conf.js devServer options
devServer:{
inline:false,
...
}