Webpack的NPM启动错误

Question

I am learning Javascript ES6. So I have installed NodeJS along with webpack. When I run the command npm start I get the following error:

    C:\Users\Saipriyank\es6>npm start

> es6@1.0.0 start C:\Users\Saipriyank\es6
> webpack --mode development

C:\Users\Saipriyank\es6\node_modules\webpack-cli\bin\cli.js:244
                                throw err;
                                ^

ReferenceError: pat is not defined
    at Object.<anonymous> (C:\Users\Saipriyank\es6\webpack.config.js:6:9)
    at Module._compile (C:\Users\Saipriyank\es6\node_modules\v8-compile-cache\v8-compile-cache.js:178:30)
    at Object.Module._extensions..js (module.js:663:10)
    at Module.load (module.js:565:32)
    at tryModuleLoad (module.js:505:12)
    at Function.Module._load (module.js:497:3)
    at Module.require (module.js:596:17)
    at require (C:\Users\Saipriyank\es6\node_modules\v8-compile-cache\v8-compile-cache.js:159:20)
    at WEBPACK_OPTIONS (C:\Users\Saipriyank\es6\node_modules\webpack-cli\bin\convert-argv.js:133:13)
    at requireConfig (C:\Users\Saipriyank\es6\node_modules\webpack-cli\bin\convert-argv.js:135:6)
    at C:\Users\Saipriyank\es6\node_modules\webpack-cli\bin\convert-argv.js:142:17
    at Array.forEach (<anonymous>)
    at module.exports (C:\Users\Saipriyank\es6\node_modules\webpack-cli\bin\convert-argv.js:140:15)
    at yargs.parse (C:\Users\Saipriyank\es6\node_modules\webpack-cli\bin\cli.js:241:39)
    at Object.parse (C:\Users\Saipriyank\es6\node_modules\yargs\yargs.js:552:18)
    at C:\Users\Saipriyank\es6\node_modules\webpack-cli\bin\cli.js:219:8
    at Object.<anonymous> (C:\Users\Saipriyank\es6\node_modules\webpack-cli\bin\cli.js:530:3)
    at Module._compile (module.js:652:30)
    at Object.Module._extensions..js (module.js:663:10)
    at Module.load (module.js:565:32)
    at tryModuleLoad (module.js:505:12)
    at Function.Module._load (module.js:497:3)
    at Module.require (module.js:596:17)
    at require (internal/module.js:11:18)
    at Object.<anonymous> (C:\Users\Saipriyank\es6\node_modules\webpack\bin\webpack.js:157:2)
    at Module._compile (module.js:652:30)
    at Object.Module._extensions..js (module.js:663:10)
    at Module.load (module.js:565:32)
    at tryModuleLoad (module.js:505:12)
    at Function.Module._load (module.js:497:3)
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! es6@1.0.0 start: `webpack --mode development`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the es6@1.0.0 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!     C:\Users\Saipriyank\AppData\Roaming\npm-cache\_logs\2018-08-29T05_47_41_511Z-debug.log

Here is the generated log file:

    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   'start' ]
2 info using npm@5.6.0
3 info using node@v8.11.3
4 verbose run-script [ 'prestart', 'start', 'poststart' ]
5 info lifecycle es6@1.0.0~prestart: es6@1.0.0
6 info lifecycle es6@1.0.0~start: es6@1.0.0
7 verbose lifecycle es6@1.0.0~start: unsafe-perm in lifecycle true
8 verbose lifecycle es6@1.0.0~start: PATH: C:\Program Files\nodejs\node_modules\npm\node_modules\npm-lifecycle\node-gyp-bin;C:\Users\Saipriyank\es6\node_modules\.bin;C:\Ruby24-x64\bin;System\;C:\Python27\;C:\Python27\Scripts;C:\WINDOWS\system32;C:\WINDOWS;C:\WINDOWS\System32\Wbem;C:\WINDOWS\System32\WindowsPowerShell\v1.0\;C:\Program Files (x86)\ATI Technologies\ATI.ACE\Core-Static;C:\xampp\php;C:\composer;C:\Program Files\Git\cmd;C:\Program Files\nodejs\;C:\Users\Saipriyank\AppData\Local\Microsoft\WindowsApps;C:\Users\Saipriyank\AppData\Roaming\npm
9 verbose lifecycle es6@1.0.0~start: CWD: C:\Users\Saipriyank\es6
10 silly lifecycle es6@1.0.0~start: Args: [ '/d /s /c', 'webpack --mode development' ]
11 silly lifecycle es6@1.0.0~start: Returned: code: 1  signal: null
12 info lifecycle es6@1.0.0~start: Failed to exec start script
13 verbose stack Error: es6@1.0.0 start: `webpack --mode development`
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 es6@1.0.0
15 verbose cwd C:\Users\Saipriyank\es6
16 verbose Windows_NT 10.0.16299
17 verbose argv "C:\\Program Files\\nodejs\\node.exe" "C:\\Program Files\\nodejs\\node_modules\\npm\\bin\\npm-cli.js" "start"
18 verbose node v8.11.3
19 verbose npm  v5.6.0
20 error code ELIFECYCLE
21 error errno 1
22 error es6@1.0.0 start: `webpack --mode development`
22 error Exit status 1
23 error Failed at the es6@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 ]

The same problem also comes when I hit the npm run start command.

I am very new to nodeJS so I really need to figure out how things work around.

Any help would be appreciated.

Thanks in advance.

Here is package.json file:

{
  "name": "es6",
  "version": "1.0.0",
  "main": "index.js",
  "scripts": {
    "start": "webpack --mode development",
    "build": "webpack --mode production"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "webpack": "^4.12.0",
    "webpack-cli": "^3.0.3"
  },
  "dependencies": {
    "debug": "^3.1.0"
  },
  "description": ""
}

Here is webpack.config.js file:

const path = require('path');

module.exports = {
    entry: path.resolve(__dirname, 'app'),
    output: {
        path: pat.resolve(__dirname, 'build'),
        filename: 'bundle.js'
    }
};

Answer 1

There is an error which says that pat is undefined. You must use path instead.

Please check the following code. const path = require('path');

module.exports = {
    entry: path.resolve(__dirname, 'app'),
    output: {
        path: path.resolve(__dirname, 'build'), // there was the problem
        filename: 'bundle.js'
    }
};

Answer 2

As error shows "unexpected string",

You forgot to add : between filename and bundle.js.

{
  context: __dirname + "/app",
  entry: "./entry",
  output: {
    path: __dirname + "/dist",
    filename: "bundle.js"
  }
}

========== EDIT ===========

As per your new update, you have spelling mistake of "pat". It should be "path".

here in this line:

path: pat.resolve(__dirname, 'build'),

this should be:

path: path.resolve(__dirname, 'build'),