Error: Cannot find module 'webpack-cli/bin/config-yargs'

[ncsantosh]

Hello,
While i was working on the "Client setup" mentioned in step 4, i got the below error.

Error Details:
[xx-client]$ ./node_modules/.bin/webpack-dev-server --open
The CLI moved into a separate package: webpack-cli
Please install 'webpack-cli' in addition to webpack itself to use the CLI
-> When using npm: npm i -D webpack-cli
-> When using yarn: yarn add -D webpack-cli
internal/modules/cjs/loader.js:1032
throw err;
^
Error: Cannot find module 'webpack-cli/bin/config-yargs'

[venkat-aws]

Did you install webpack and webpack-cli ? Even I have an issue with client setup, but beyond step 4 ... I got this issue and installed web pack-cli and it worked well.
May be the authors can share appropriate answer to your question. Thanks.

[maheshtnl2009]

I am also encountering the same issue in step 4 for client set up.
I have also tried instaling the webpack and webpack cli in the same machine , and also in other machine and encountering the same error

D:\AWS\Aws Angular\Demos\gitdemo\aws-cloudwatch-building-dashboard-outside-aws-console\client>npm i -g webpack
C:\Users\MaheshVelupuri\AppData\Roaming\npm\webpack -> C:\Users\MaheshVelupuri\AppData\Roaming\npm\node_modules\webpack\bin\webpack.js

• [email protected]
  added 79 packages from 124 contributors in 64.282s

D:\AWS\Aws Angular\Demos\gitdemo\aws-cloudwatch-building-dashboard-outside-aws-console\client>npm i -g webpack-cli
C:\Users\MaheshVelupuri\AppData\Roaming\npm\webpack-cli -> C:\Users\MaheshVelupuri\AppData\Roaming\npm\node_modules\webpack-cli\bin\cli.js
npm WARN [email protected] requires a peer of [email protected] || 5.x.x but none is installed. You must install peer dependencies yourself.
npm WARN @webpack-cli/[email protected] requires a peer of [email protected] || 5.x.x but none is installed. You must install peer dependencies yourself.

• [email protected]
  updated 1 package in 16.544s

D:\AWS\Aws Angular\Demos\gitdemo\aws-cloudwatch-building-dashboard-outside-aws-console\client>npm start

js-widget@ start D:\AWS\Aws Angular\Demos\gitdemo\aws-cloudwatch-building-dashboard-outside-aws-console\client
webpack-dev-server --open

internal/modules/cjs/loader.js:638
throw err;
^

Error: Cannot find module 'webpack-cli/bin/config-yargs'
at Function.Module._resolveFilename (internal/modules/cjs/loader.js:636:15)
at Function.Module._load (internal/modules/cjs/loader.js:562:25)
at Module.require (internal/modules/cjs/loader.js:692:17)
at require (internal/modules/cjs/helpers.js:25:18)
at Object. (D:\AWS\Aws Angular\Demos\gitdemo\aws-cloudwatch-building-dashboard-outside-aws-console\client\node_modules\webpack-dev-server\bin\webpack-dev-server.js:65:1)
at Module._compile (internal/modules/cjs/loader.js:778:30)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:789:10)
at Module.load (internal/modules/cjs/loader.js:653:32)
at tryModuleLoad (internal/modules/cjs/loader.js:593:12)
at Function.Module._load (internal/modules/cjs/loader.js:585:3)
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! js-widget@ start: webpack-dev-server --open
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the js-widget@ start script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

[tomohirohamasaki]

I faced the same problem, but I solved it by modifying package.json.

{
  "name": "js-widget",
  "scripts": {
    "build": "./node_modules/.bin/webpack server --config webpack.config.js",
    "start": "./node_modules/.bin/webpack server --open"
  },
  "dependencies": {
    "@babel/core": "^7.0.0-beta.32",
    "@babel/preset-env": "^7.0.0-beta.32",
    "babel-loader": "^8.0.0-beta.0",
    "copy-webpack-plugin": "^4.5.2",
    "html-loader": "^0.5.1",
    "json-loader": "^0.5.7",
    "js-widgets": "0.0.92",
    "webpack": "4.46.0",
    "webpack-cli": "^4.7.2",
    "webpack-dev-server": ">=3.11.2",
    "webpack-dev-middleware": "3.7.3",
    "request": "^2.88.0"
  }
}