How to Fix Cannot find module ‘webpack/bin/config-yargs’

by

The error cannot find module ‘webpack/bin/config-yargs’ occurs when “your webpack installation is not up to date.”

To fix the cannot find module ‘webpack/bin/config-yargs’, starting from “webpack-cli 4” or “webpack 5”, change “webpack-dev-server” to “webpack serve.”

This is how you need to update the package.json file to reflect this change:

"scripts": {
   "serve": "webpack serve --config config/webpack.dev.js --progress"
}

By using the above script, you can start the Webpack development server with the specified configuration file and see the progress in the terminal by running:

npm run serve

This change is a common source of confusion for those migrating to newer versions of Webpack.

Alternate solutions

For webpack-cli 3.x and below

If the webpack-cli version is less than 4.x, You can use “webpack-dev-server”:

 "scripts": {
   "dev-server": "webpack-dev-server"
 }

For webpack-cli 4.x and above

If the webpack-cli version is 4.x or higher, you can use “webpack serve”

 "scripts": { 
   "dev-server": "webpack serve" 
 }

These changes reflect the updates in the Webpack ecosystem, and developers migrating between versions should be aware of this to ensure their development servers run as expected.

Upgrade your webpack version

You can upgrade the webpack by running the following command:

npm install --save-dev webpack webpack-cli webpack-dev-server

Reinstall Webpack

Try reinstalling Webpack to ensure that all the necessary files and dependencies are properly installed:

npm uninstall webpack webpack-cli

npm install webpack webpack-cli --save-dev

Check Your Webpack Version

Make sure that you are using compatible versions of Webpack and related packages. You can check the versions by running:

npm list webpack webpack-cli

If you are using an older project, you might need to “downgrade or upgrade your Webpack to match the project’s requirements.”

I hope this will fix your issue!

Related posts

Field ‘browser’ doesn’t contain a valid alias configuration

TypeError: this.getOptions is not a function

“Invalid Host header” message when connecting to webpack-dev-server remotely

Leave a Comment