webpack-dev-server: Error: Cannot find module 'webpack-cli/bin/config-yargs' when use v5

You need to use webpack serve

Yes, please use webpack serve for 4 version to run webpack dev server, we will remove own binaries in next version, feel free to leave feedback if something doesn’t work

Could someone explain what “webpack serve” is actually doing as a command, as opposed to “webpack-dev-server”? It might help people understand why they now have to do this.

Is it running the “webpack-serve” server instead of the “webpack-dev-server” one? (if so, how does it work without that dependency being installed?)

I found plenty of reports saying webpack-dev-server is only in maintenance and that people should use webpack-serve instead, but that doesn’t seem to be the case here as web-pack-dev server now appears to have a major new version in beta?

This is all quite confusing for people I think! 😦

Please use webpack serve instead of using webpack-dev-server in package.json, it was answered a lot of time, but because each every time no wants to read but just writes, the answer constantly disappears

I don’t know if you are the same team that maintains webpack-dev-server but wouldn’t be cool if there is a post or article exposing this change? From my point of view this is some kind of breaking change… Don’t you agree? Maybe a commentary on the changelog should be enough.

This seems like a lot of hoops to jump through compared to just doing webpack-dev-server which used to work

@evilebottnawi thank you. This really needs to be mentioned in the migrate to webpack 5 doc that is out there

@bahtou fixed in webpack-cli, release will be today/tomorrow, feel free to feedback after new release

Hello 👋. To fix it just do 2 things.

1. Install npm i webpack-cli @webpack-cli/init
2. add this to your package.json “scripts”: { “start”: “webpack-cli serve --mode development” },

done!

If I use “webpack serve” instead of “webpack-dev-server” then my “–config” file option is being ignored. What is the equivalent for providing the config file?

Hello 👋. To fix it just do 2 things.

1. Install npm i webpack-cli @webpack-cli/init
2. add this to your package.json “scripts”: { “start”: “webpack-cli serve --mode development” },

done!

perfect

So is webpack-dev-server not needed when using webpack 5?

Will webpack serve support eventually the same cli options that webpack-dev-server currently does?

@galbeiroc Do you read my answer? Please use webpack serve to run webpack dev server

it works succesfully

webpack 5.0.0 compiled successfully in 430 ms

"dev": "webpack serve"

Thanks !! @evilebottnawi

@evilebottnawi is this a temporary solution and if not could you give me an example of how to live-reload on change with the webpack serve

I used webpack serve，but it didn’t work. This is my package dependencies:

  "devDependencies": {
    "webpack": "^5.0.0-beta.12",
    "webpack-cli": "^4.0.0-beta.1",
    "webpack-dev-server": "^3.10.2"
  }

Fixed in webpack-dev-server@4-beta.0

@evilebottnawi I think the issue is we do not get the same functionality with just using webpack serve and there doesn’t seem to be any explanation with how to get it working in the same way. Are you going to provide some official documentation of these changes?

I’m also having the same problems as @Suwings where my config file doesn’t get looked at when using webpack serve . Has anyone found a solution yet?

How was my comment spam? how rude. 👎 This thread has an answer that doesn’t correspond to the docs. The webpack serve command doesn’t come up when searching the docs of Webpack 4/5.

In my case the solution was just use previous versions -

"webpack": "^4.44.1",
"webpack-cli": "^3.3.12",
"webpack-dev-server": "^3.11.0"

Why would this be marked as spam. This is actually the solution for right now until a better one presents itself. It seems like someone is trying to force a new version before support has caught up

In v5.1.3 , it can be started by using the webpack serve command, but it still requires webpack-dev-server dependency.

"webpack": "^5.1.3",
"webpack-cli": "^4.1.0",
"webpack-dev-server": "^3.11.0",

It has been put into use without any problems.

https://github.com/webpack/webpack-cli/issues/1948 and please use emoji, no need to spam, otherwise other developers won’t be able to find the answer

https://github.com/webpack/webpack-dev-server/issues/2770#issuecomment-709209686

I wrote a comment in this issue. I don’t think this behavior will load the webpack config. wrong?

Thanks. For such a mainstream tool, it should be in the docs.

@galbeiroc Do you read my answer? Please use webpack serve to run webpack dev server

any update on this.

@evilebottnawi That specific issue was fixed in https://github.com/webpack/webpack-cli/pull/1376 5 months ago, but it hasn’t been released yet. And yes, that’s a Yarn PnP error message

  "devDependencies": {
    "@webpack-cli/serve": "1.0.1-alpha.5",
    "webpack": "5.0.0-beta.26",
    "webpack-cli": "4.0.0-beta.8",
    "webpack-dev-server": "^3.11.0"
  },

$ yarn webpack-cli serve

[webpack-cli] The command moved into a separate package: @webpack-cli/serve

(node:12806) [MODULE_NOT_FOUND] Error: @webpack-cli/package-utils tried to access cross-spawn, but it isn't declared in its dependencies; this makes the require call ambiguous and unsound.
? Would you like to install @webpack-cli/serve? (That will run npm install -D @webpack-cli/serve) (Y/n) › true

OK，I will.

It didn’t work for me until I specified the ‘contentBase’ and ‘port’ property of the devServer and ran the command ‘webpack serve --config ./webpack.config.js’

SOLUTION - https://github.com/webpack/webpack-cli/issues/1948#issuecomment-708939567

In my case the solution was just use previous versions -

"webpack": "^4.44.1",
"webpack-cli": "^3.3.12",
"webpack-dev-server": "^3.11.0"

@infime we consider this, thanks for feedback

@evilebottnawi I was using overlay, https and cert/ key in several different invocations for different scenarios. Letting webpack serve --help show the available options would be helpful as well.

@bahtou please create reproducible test repo and open an issue in webpack-cli, thanks!

@evilebottnawi Just reporting results: It works! Thank you!