./bin/webpack-dev-server fails with Error: Cannot find module 'webpack-cli/bin/config-yargs'

[cirosantilli]

39e7c56d6dfaa8b8ec169608769957f93e5c4791

npm install
rails s

Seems fine, on other shell:

./bin/webpack-dev-server

fails with:

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:883
  throw err;
  ^

Error: Cannot find module 'webpack-cli/bin/config-yargs'
Require stack:
- /home/ciro/git/react-rails-example-app/node_modules/webpack-dev-server/bin/webpack-dev-server.js
    at Function.Module._resolveFilename (internal/modules/cjs/loader.js:880:15)
    at Function.Module._load (internal/modules/cjs/loader.js:725:27)
    at Module.require (internal/modules/cjs/loader.js:952:19)
    at require (internal/modules/cjs/helpers.js:88:18)
    at Object.<anonymous> (/home/ciro/git/react-rails-example-app/node_modules/webpack-dev-server/bin/webpack-dev-server.js:65:1)
    at Module._compile (internal/modules/cjs/loader.js:1063:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:1092:10)
    at Module.load (internal/modules/cjs/loader.js:928:32)
    at Function.Module._load (internal/modules/cjs/loader.js:769:14)
    at Function.executeUserEntryPoint [as runMain] (internal/modules/run_main.js:72:12) {
  code: 'MODULE_NOT_FOUND',
  requireStack: [
    '/home/ciro/git/react-rails-example-app/node_modules/webpack-dev-server/bin/webpack-dev-server.js'
  ]
}

OK, I run:

npm i -D webpack-cli
./bin/webpack-dev-server

but problem persists:

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

Error: Cannot find module 'webpack-cli/bin/config-yargs'
Require stack:
- /home/ciro/git/react-rails-example-app/node_modules/webpack-dev-server/bin/webpack-dev-server.js
    at Function.Module._resolveFilename (internal/modules/cjs/loader.js:880:15)
    at Function.Module._load (internal/modules/cjs/loader.js:725:27)
    at Module.require (internal/modules/cjs/loader.js:952:19)
    at require (internal/modules/cjs/helpers.js:88:18)
    at Object.<anonymous> (/home/ciro/git/react-rails-example-app/node_modules/webpack-dev-server/bin/webpack-dev-server.js:65:1)
    at Module._compile (internal/modules/cjs/loader.js:1063:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:1092:10)
    at Module.load (internal/modules/cjs/loader.js:928:32)
    at Function.Module._load (internal/modules/cjs/loader.js:769:14)
    at Function.executeUserEntryPoint [as runMain] (internal/modules/run_main.js:72:12) {
  code: 'MODULE_NOT_FOUND',
  requireStack: [
    '/home/ciro/git/react-rails-example-app/node_modules/webpack-dev-server/bin/webpack-dev-server.js'
  ]
}

This is the relevant SO apparently: https://stackoverflow.com/questions/40379139/cannot-find-module-webpack-bin-config-yargs

I try:

./bin/webpack serve

but fails with:

ERROR in Entry module not found: Error: Can't resolve 'serve' in '/home/ciro/git/react-rails-example-app'

A bit more webpack knowledge or trial and error is needed :-)

Ubuntu 20.10, Ruby 2.7, node.js v14.16.0. You might also want to track the package-lock.json that currently gets generated by npm.

[agusbrand]

I'm having the same issue. Any updates?

[cirosantilli]

Not on my side :-( I ended up going for a Node stack for other reasons finally.

[Stillerman]

Same issue.