nodejs webpack server not starting - node.js

Question

I am new to NodeJs and trying to setup react app. Getting following error on the console while starting the server.
Not able to start the server, have tried several options.
c:\Users\vaibhav\Desktop\node>npm start
> test#1.0.0 start c:\Users\vaibhav\Desktop\node
> webpack-dev-server --hot
x ?wds?: Invalid configuration object. Webpack has been initialised using a configuration object that does not match the API schema.
- configuration.module has an unknown property 'loaders'. These properties are valid:
object { exprContextCritical?, exprContextRecursive?, exprContextRegExp?, exprContextRequest?, noParse?, rules?, defaultRules?, unknownContextCritical?, unknownContextRecursive?, unknownContextRegExp?, unknownContextRequest?, unsafeCache?, wrappedContextCritical?, wrappedContextRecursive?, wrappedContextRegExp?, strictExportPresence?, strictThisContextOnImports? }
-> Options affecting the normal modules (`NormalModuleFactory`).
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! test#1.0.0 start: `webpack-dev-server --hot`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the test#1.0.0 start script.
npm ERR! This is probably not a problem with npm. There is likely additional log
ging output above.
npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\vaibhav\AppData\Roaming\npm-cache\_logs\2018-09-06T17_00_03
_303Z-debug.log
The log file shows the following error:
0 info it worked if it ends with ok
1 verbose cli [ 'C:\\Program Files\\nodejs\\node.exe',
1 verbose cli 'C:\\Program Files\\nodejs\\node_modules\\npm\\bin\\npm-cli.js',
1 verbose cli 'run',
1 verbose cli 'start' ]
2 info using npm#5.6.0
3 info using node#v8.11.4
4 verbose run-script [ 'prestart', 'start', 'poststart' ]
5 info lifecycle test#1.0.0~prestart: test#1.0.0
6 info lifecycle test#1.0.0~start: test#1.0.0
7 verbose lifecycle test#1.0.0~start: unsafe-perm in lifecycle true
8 verbose lifecycle test#1.0.0~start: PATH: C:\Program Files\nodejs\node_modules\npm\node_modules\npm-lifecycle\node-gyp-bin;c:\Users\vaibhav\Desktop\node\node_modules\.bin;C:\Windows;C:\Windows\system32;C:\Windows\system32\wbem;C:\ProgramData\Oracle\Java\javapath;C:\app\vaibhav\product\11.2.0\client_1\bin;C:\Program Files (x86)\Attachmate\E!E2K\;C:\Windows\System32\WindowsPowerShell\v1.0\;C:\Windows\System32\WindowsPowerShell\v1.0\;C:\Program Files (x86)\Attachmate\Reflection\;C:\Users\vaibhav\AppData\Local\Programs\Python\Python36;C:\Users\vaibhav\AppData\Local\Programs\Python\Python36\Scripts;C:\Strawberry\c\bin;C:\Strawberry\perl\site\bin;C:\Strawberry\perl\bin;C:\Windows\System32\WindowsPowerShell\v1.0\;C:\Program Files\1E\NomadBranch\;C:\Windows\System32\WindowsPowerShell\v1.0\;C:\Program Files\TortoiseSVN\bin;C:\Users\vaibhav\Documents\softwares\apache-maven-3.3.3\bin;C:\Program Files (x86)\GNU\GnuPG;C:\Program Files (x86)\Enterprise Vault\EVClient\;C:\Program Files (x86)\Java\jre1.8.0_152\bin;C:\Program Files (x86)\WebEx\Productivity Tools;C:\Program Files (x86)\CheckPoint\Endpoint Security\Endpoint Common\bin;C:\Program Files\nodejs\;C:\Users\vaibhav\AppData\Local\GitHubDesktop\bin;C:\Program Files\Microsoft VS Code\bin;C:\Users\vaibhav\AppData\Roaming\npm
9 verbose lifecycle test#1.0.0~start: CWD: c:\Users\vaibhav\Desktop\node
10 silly lifecycle test#1.0.0~start: Args: [ '/d /s /c', 'webpack-dev-server --hot' ]
11 silly lifecycle test#1.0.0~start: Returned: code: 1 signal: null
12 info lifecycle test#1.0.0~start: Failed to exec start script
13 verbose stack Error: test#1.0.0 start: `webpack-dev-server --hot`
13 verbose stack Exit status 1
13 verbose stack at EventEmitter.<anonymous> (C:\Program Files\nodejs\node_modules\npm\node_modules\npm-lifecycle\index.js:285: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> (C:\Program Files\nodejs\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 test#1.0.0
15 verbose cwd c:\Users\vaibhav\Desktop\node
16 verbose Windows_NT 6.1.7601
17 verbose argv "C:\\Program Files\\nodejs\\node.exe" "C:\\Program Files\\nodejs\\node_modules\\npm\\bin\\npm-cli.js" "run" "start"
18 verbose node v8.11.4
19 verbose npm v5.6.0
20 error code ELIFECYCLE
21 error errno 1
22 error test#1.0.0 start: `webpack-dev-server --hot`
22 error Exit status 1
23 error Failed at the test#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 ]
My package.json looks like the following:
{
"name": "test",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"start": "webpack-dev-server --hot"
},
"author": "",
"license": "ISC",
"dependencies": {
"babel-core": "^6.26.3",
"babel-loader": "^8.0.2",
"babel-preset-es2015": "^6.24.1",
"babel-preset-react": "^6.24.1",
"react": "^16.4.2",
"react-dom": "^16.4.2",
"webpack": "^4.17.2",
"webpack-dev-server": "^3.1.7"
},
"devDependencies": {
"webpack-cli": "^3.1.0"
}
}
Please let me know in case you require more details. I will provide that in comments.

Answer 1

The answer is in your question:
wds?: Invalid configuration object. Webpack has been initialised using a configuration object that does not match the API schema.
- configuration.module has an unknown property 'loaders'. These properties are valid: object { exprContextCritical?, exprContextRecursive?, exprContextRegExp?, exprContextRequest?, noParse?, rules?, defaultRules?, unknownContextCritical?, unknownContextRecursive?, unknownContextRegExp?, unknownContextRequest?, unsafeCache?, wrappedContextCritical?, wrappedContextRecursive?, wrappedContextRegExp?, strictExportPresence?, strictThisContextOnImports? }
In your config, instead of module.loaders, it has to be module.rules.