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

[jamiek-acl]

• Operating System: Mac OS

• Node Version: 10.15.1

• NPM Version: 6.4.1

• webpack Version: 4.34.0

• webpack-dev-server Version: 3.2.1

• This is a bug...?

• This is a modification request

Code

// webpack.config.js
const path = require('path');
const config = require('./webpack.dev.config');
const HtmlWebpackPlugin = require('html-webpack-plugin');

const newConfig = Object.assign({}, config);

newConfig.entry = ['@babel/polyfill', './app/features/Certifications/index', 'webpack/hot/only-dev-server'];

newConfig.output = {
  filename: 'webpack-certifications-bundle.js',
  path: path.resolve('../app/assets/webpack'),
  publicPath: '/',
};

newConfig.devServer = {
  historyApiFallback: true,
  hot: true,
  open: true,
  openPage: 'dashboard',
  port: 9000,
  proxy: {
    '/api': {
      target: 'http://localhost:9010',
      secure: false,
    },
  },
  publicPath: '/',
};

newConfig.plugins.push(new HtmlWebpackPlugin());

module.exports = newConfig;
module.exports.devtool = 'cheap-module-eval-source-map';

// package.json
scripts: {
  "dev:cert:webpack": "NODE_ENV=development webpack-dev-server --config webpack.dev.certifications.config.js"
}

Expected Behavior

Running npm run dev:cert:webpack starts webpack dev server.

Actual Behavior

~/src/projects/client$ npm run dev:cert:webpack

> acl-project-manager@0.0.1 dev:cert:webpack /Users/jamie/src/projects/client
> NODE_ENV=development webpack-dev-server --config webpack.config.js

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

Error: Cannot find module 'webpack-cli/bin/config-yargs'
    at Function.Module._resolveFilename (internal/modules/cjs/loader.js:581:15)
    at Function.Module._load (internal/modules/cjs/loader.js:507:25)
    at Module.require (internal/modules/cjs/loader.js:637:17)
    at require (internal/modules/cjs/helpers.js:22:18)
    at Object.<anonymous> (/Users/jamie/src/projects/client/node_modules/webpack-dev-server/bin/webpack-dev-server.js:77:1)
    at Module._compile (internal/modules/cjs/loader.js:689:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:700:10)
    at Module.load (internal/modules/cjs/loader.js:599:32)
    at tryModuleLoad (internal/modules/cjs/loader.js:538:12)
    at Function.Module._load (internal/modules/cjs/loader.js:530:3)
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! acl-project-manager@0.0.1 dev:cert:webpack: `NODE_ENV=development webpack-dev-server --config webpack.dev.certifications.config.js`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the acl-project-manager@0.0.1 dev:cert:webpack 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!     /Users/jamie/.npm/_logs/2019-06-14T23_23_20_044Z-debug.log

If I upgrade to webpack-dev-server 3.7.1, this error does not occur.

Thank you for your help.

[hiroppy]

hmm. webpack-cli changed a directory structure...
related: https://github.com/webpack/webpack-cli/pull/781/files#diff-2ec72bdd4a30cf784ac1e831f1360746

But, why didn't you resolve this path? I want to know your webpkack-cli's version.
https://github.com/webpack/webpack-dev-server/blob/master/bin/webpack-dev-server.js#L53

[hiroppy]

I cannot reproduce this issue.

Details

ᐅ npm i webpack-dev-server

+ webpack-dev-server@3.7.1
added 441 packages from 281 contributors and audited 3458 packages in 18.504s
found 0 vulnerabilities

ᐅ npx webpack-dev-server
Cannot find module 'webpack'
Require stack:
- /Users/Desktop/test2/node_modules/webpack-dev-server/bin/webpack-dev-server.js

ᐅ npm i webpack
npm WARN saveError ENOENT: no such file or directory
npm WARN enoent ENOENT: no such file or directory
npm WARN test2 No description
npm WARN test2 No repository field.
npm WARN test2 No README data
npm WARN test2 No license field.

+ webpack@4.34.0
added 148 packages from 130 contributors and audited 15992 packages in 10.067s
found 0 vulnerabilities

ᐅ npx webpack-dev-server
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
Cannot find module 'webpack-cli/bin/config-yargs'
Require stack:
- /Users/Desktop/test2/node_modules/webpack-dev-server/bin/webpack-dev-server.js

ᐅ npm i webpack-cli

> webpack-cli@3.3.4 postinstall
> node ./bin/opencollective.js



                            Thanks for using webpack!
                 Please consider donating to our Open Collective
                        to help us maintain this package.



              👉  Donate: https://opencollective.com/webpack/donate


npm WARN saveError ENOENT: no such file or directory
npm WARN enoent ENOENT: no such file or directory
npm WARN test2 No description
npm WARN test2 No repository field.
npm WARN test2 No README data
npm WARN test2 No license field.

+ webpack-cli@3.3.4
added 21 packages from 21 contributors and audited 22506 packages in 5.154s
found 0 vulnerabilities

ᐅ npx webpack-dev-server
...  

[alexander-akait]

You use old webpack-cli version, please update webpack-cli

[jamiek-acl]

@evilebottnawi and @hiroppy I'm on the latest

    "webpack-cli": "^3.3.4",

[hiroppy]

We cannot reproduce your issue. if we need to investigate this issue, please submit the reproducible repo.

[jamiek-acl]

It looks like you used webpack-dev-server@3.7.1, but I had the problem with version 3.2.1 (I am not able to upgrade).

[snaill]

webpack-dev-server@3.7.1 is OK.

[snaill]

webpack-dev-server@3.7.2 error: Cannot find module 'yargs'

[dhantke]

Same problem here.

• webpack-dev-server@3.7.2: does not work
• webpack-dev-server@3.7.1: works

@snaill thx for investigation!

[Dheeraj-GL]

same issue on 3.8.2

[sneeze-attack]

I ran into this issue after updating webpack-cli from:

webpack-cli ^3.2.1 → ^3.3.9

I fixed it by changing:

node_modules\webpack-dev-server\bin\webpack-dev-server.js

Line 84:
require('webpack-cli/bin/config-yargs')(yargs);
To:
require('webpack-cli/bin/config/config-yargs')(yargs);

Line 92:
const config = require('webpack-cli/bin/convert-argv')(yargs, argv, {
To:
const config = require('webpack-cli/bin/utils/convert-argv')(yargs, argv, {