Multiple webpack configurations return an error

[popelenkow]

• This is a bug
• This is a modification request

Code

// webpack.config.js
module.exports = [{
  devServer: {
    hot: "only",
  },
  entry: {
    common: "./src/common.ts",
  },
  output: {
    library: {
      type: "umd",
    },
  },
}, {
  entry: {
    index: "./src/index.ts",
  },
}];

Please paste the results of npx webpack-cli info here, and mention other relevant information

System:
OS: Windows 10 10.0.19043
CPU: (16) x64 AMD Ryzen 7 2700 Eight-Core Processor
Memory: 18.82 GB / 31.92 GB
Binaries:
Node: 14.17.3 - C:\Program Files\nodejs\node.EXE
Yarn: 1.22.10 - ~\AppData\Roaming\npm\yarn.CMD
npm: 6.14.13 - C:\Program Files\nodejs\npm.CMD
Browsers:
Chrome 93.0.4577.63 (64-bit)
Firefox: 90.0.2 (64-bit)
Packages:
copy-webpack-plugin: 9.0.1 => 9.0.1
webpack: 5.52.1 => 5.52.1
webpack-cli: 4.8.0 => 4.8.0
webpack-dev-server: 4.2.0 => 4.2.0
webpack-merge: 5.8.0 => 5.8.0

Expected Behavior

The page loads without errors in devtools console

Actual Behavior

Devtools error: common.js:1408 GET http://localhost:3000/common.cfa969f6bfa4ff164773.hot-update.json 404 (Not Found)

For Bugs; How can we reproduce the behavior?

Update webpack-dev-server 4.0.0-rc.1 to {4.2.0, 4.1.1, 4.1.0, 4.0.0} and get error. See demo repo:
https://github.com/popelenkow/WebpackDevServerMultipleConfigs/tree/feature/update
Open repo. Call yarn & yarn dev. Open http://localhost:3000/

For Features; What is the motivation and/or use-case for the feature?

[alexander-akait]

Multiple web targets is not supported, you need to start multiple dev servers, but it will be implemented in near future, webpack/webpack-dev-middleware#979 and #3803

[alexander-akait]

You can see:

[HMR] Waiting for update signal from WDS...
VM217 index.js:519 [webpack-dev-server] Hot Module Replacement enabled.
log.js:24 [HMR] Waiting for update signal from WDS...
VM217 index.js:519 [webpack-dev-server] Live Reloading enabled.
VM217 index.js:519 [webpack-dev-server] App hot update...
VM204 log.js:24 [HMR] Checking for updates on the server...
index.js:519 [webpack-dev-server] Hot Module Replacement enabled.
index.js:519 [webpack-dev-server] Live Reloading enabled.

So you have two HMR runtime code on the same page, in future you will need to start two dev server and proxy, I will provide configuration

[alexander-akait]

Also if you have depended builds, you need to use https://webpack.js.org/configuration/other-options/#dependencies, otherwise you get concurrency and cache problems

[alexander-akait]

If you provide more information I will say you how to configure it in right way