Serve command not passing webpack `devServer` config to webpack-dev-server #1469

lukereative · 2020-04-15T22:37:44Z

Describe the bug

Serve command not passing webpack devServer config to webpack-dev-server

webpack.dev.js

  devServer: {
    https: isUsingHTTPS && secureLocalDomain,
    host: "myreactapp.test",
    hot: true,
    port: 8080,
    publicPath: "/myreactapp",
    quiet: true,
    proxy: {
      '**': {
        target: localURL,
        secure: false,
        headers: {
          'X-Dev-Server-Proxy': localURL
        }
      }
    }
  }

command used

webpack serve --config webpack.dev.js

What is the current behavior?

The webpack server runs but doesn't pick up all the options from the devServer config. You can see this by webpack output being undefined in the CLI output, but also the proxy was also not working.

ℹ ｢wds｣: Project is running at http://myreactapp.test:8080/
ℹ ｢wds｣: webpack output is served from undefined
ℹ ｢wds｣: Content not from webpack is served from /path/to/my/reactapp

To Reproduce

Relevant entries from `package.json`

"@webpack-cli/serve": "^1.0.1-alpha.5",
"webpack": "^5.0.0-beta.13",
"webpack-cli": "^4.0.0-beta.8",

Steps to reproduce the behavior:

Define a devServer config in your webpack config file
Run webpack serve --config webpack.dev.js

Expected behavior

Previously the dev server would pick up devServer config object from your webpack config file

Additional context

If I change line 28 from startDevServer.ts it works as expected but obviously this ignores the cli overrides.

- const server = new Server(compiler, options);
+ const server = new Server(compiler, devServerOptions);

CLI output

ℹ ｢wds｣: Project is running at http://myreactapp.test:8080/
ℹ ｢wds｣: webpack output is served from /eccreactapp/dist
ℹ ｢wds｣: Content not from webpack is served from /path/to/my/reactapp

The text was updated successfully, but these errors were encountered:

anshumanv · 2020-04-16T02:29:05Z

Taking a look, thanks for the report!

anshumanv · 2020-04-16T03:50:50Z

Found the issue, will fix in a bit. 👍

anshumanv · 2020-04-16T03:51:31Z

Issue - devServer config was never passed fully to the server.

anshumanv · 2020-04-16T04:22:48Z

@evilebottnawi even after passing clientLogLevel: "none" or silent in server config, I'm still seeing logs, this should not be the case right?

 ✘  ~/Code/tests  webpack-cli serve --config webpack.config.js
{ liveReload: true,
  serveIndex: true,
  inline: true,
  clientLogLevel: 'silent',
  host: 'localhost',
  port: 1234,
  publicPath: '/',
  hot: true,
  proxy:
   { '**': { target: 'test', secure: false, headers: [Object] } } }
ℹ ｢wds｣: Project is running at http://localhost:1234/
ℹ ｢wds｣: webpack output is served from /
ℹ ｢wds｣: Content not from webpack is served from /Code/tests
⚠ ｢wdm｣: Hash: d28daed123b499d6b1b7
Version: webpack 4.42.1
Time: 350ms
Built at: 04/16/2020 9:51:46 AM
  Asset     Size  Chunks             Chunk Names
main.js  155 KiB       0  [emitted]  main
Entrypoint main = main.js
 [1] ../GitHub/webpack-cli/node_modules/webpack/hot/log.js 1.34 KiB {0} [built]
 [4] ../GitHub/webpack-cli/node_modules/webpack-dev-server/client/utils/log.js 964 bytes {0} [built]
 [5] ../GitHub/webpack-cli/node_modules/webpack/hot/emitter.js 75 bytes {0} [built]
 [6] multi ../GitHub/webpack-cli/node_modules/webpack-dev-server/client?http://localhost:1234 ../GitHub/webpack-cli/node_modules/webpack/hot/dev-server.js ./index.js 52 bytes {0} [built]
 [7] ../GitHub/webpack-cli/node_modules/webpack-dev-server/client?http://localhost:1234 4.29 KiB {0} [built]
 [8] ../GitHub/webpack-cli/node_modules/webpack-dev-server/node_modules/strip-ansi/index.js 161 bytes {0} [built]
[10] ../GitHub/webpack-cli/node_modules/webpack-dev-server/client/socket.js 1.53 KiB {0} [built]
[13] ../GitHub/webpack-cli/node_modules/webpack-dev-server/client/overlay.js 3.51 KiB {0} [built]
[19] ../GitHub/webpack-cli/node_modules/webpack-dev-server/client/utils/sendMessage.js 402 bytes {0} [built]
[20] ../GitHub/webpack-cli/node_modules/webpack-dev-server/client/utils/reloadApp.js 1.59 KiB {0} [built]
[22] ../GitHub/webpack-cli/node_modules/webpack-dev-server/client/utils/createSocketUrl.js 2.91 KiB {0} [built]
[31] ../GitHub/webpack-cli/node_modules/webpack/hot sync nonrecursive ^\.\/log$ 170 bytes {0} [built]
[32] ../GitHub/webpack-cli/node_modules/webpack/hot/dev-server.js 1.59 KiB {0} [built]
[33] ../GitHub/webpack-cli/node_modules/webpack/hot/log-apply-result.js 1.27 KiB {0} [built]
[34] ./index.js 19 bytes {0} [built]
    + 20 hidden modules

WARNING in configuration
The 'mode' option has not been set, webpack will fallback to 'production' for this value. Set 'mode' option to 'development' or 'production' to enable defaults for each environment.
You can also set it to 'none' to disable any default behavior. Learn more: https://webpack.js.org/configuration/mode/
ℹ ｢wdm｣: Compiled with warnings.

Dev server version: webpack-dev-server@3.10.3

alexander-akait · 2020-06-19T14:00:06Z

@anshumanv yep, because it is logs from server, not from client

anshumanv · 2020-06-19T14:24:20Z

@anshumanv yep, because it is logs from server, not from client

Yes, But it should pass the devServer object from the config right to DevServer right?

alexander-akait · 2020-06-19T14:29:25Z

@anshumanv we should get devServer config, override specified CLI flags and send it to dev server

anshumanv · 2020-06-19T14:31:11Z

@evilebottnawi yep, fix is here - #1470

lukereative · 2020-06-30T22:46:25Z

Fix is now here #1649

gabriel-peracio · 2020-08-03T14:49:25Z

This is a pretty major blocker for my workflow, hope this gets solved soon!

ylemkimon · 2020-08-31T10:16:05Z

#1649 is now merged. I can confirm the issue is fixed with webpack-cli#next and webpack-dev-server#v4.

Johannestegner · 2020-09-10T19:14:31Z

Will this be released in a new alpha/beta release soon? Would be wonderful to have it working :)

gabriel-peracio · 2020-09-17T16:29:38Z

I guess we need to wait for #1634?

Kinda weird that #1649 (the PR that fixes this issue) was merged, but has not been part of a release yet. Without #1649, devServer is basically broken (In my use case I need the proxy options, I have resorted to patching webpack)

Johannestegner · 2020-09-17T18:54:30Z

(In my use case I need the proxy options, I have resorted to patching webpack)

Ya, kinda been considering doing that myself! hehe :)

gabriel-peracio · 2020-09-21T13:10:56Z

Looks like this was fixed in webpack-cli v4.0.0-beta.9

I can't test it now, but if someone can confirm, we might be able to close this issue. If no one is available, I'll try to find some time to test it.

Johannestegner · 2020-09-21T16:07:29Z

Tried with latest, sadly, in my case, all webpack (and cli commands) have stopped working:

> cross-env NODE_ENV=development webpack serve

CLI for webpack must be installed.
  webpack-cli (https://github.com/webpack/webpack-cli)

We will use "npm" to install the CLI via "npm install -D".
Do you want to install 'webpack-cli' (yes/no): no
You need to install 'webpack-cli' to use webpack via CLI.
You can also install the CLI manually.

Following packages installed:

    "dependencies": {
        "@babel/runtime-corejs3": "^7.11.2"
    },
    "devDependencies": {
        "@babel/core": "^7.11.6",
        "@jitesoft/babel-preset-main": "^2.5.2",
        "@webpack-cli/serve": "^1.0.1-alpha.5",
        "babel-loader": "^8.1.0",
        "copy-webpack-plugin": "^6.1.1",
        "core-js": "^3.6.5",
        "cross-env": "^7.0.2",
        "css-loader": "^4.3.0",
        "file-loader": "^6.1.0",
        "imagemin-gifsicle": "^7.0.0",
        "imagemin-mozjpeg": "^9.0.0",
        "imagemin-optipng": "^8.0.0",
        "imagemin-svgo": "^8.0.0",
        "imagemin-webp-webpack-plugin": "^3.3.3",
        "imagemin-webpack": "^5.1.1",
        "mini-css-extract-plugin": "^0.11.2",
        "optimize-css-assets-webpack-plugin": "^5.0.4",
        "sass": "^1.26.11",
        "sass-loader": "^10.0.2",
        "style-loader": "^1.2.1",
        "terser-webpack-plugin": "^4.2.2",
        "url-loader": "^4.1.0",
        "webpack": "^5.0.0-rc.0",
        "webpack-cli": "^4.0.0-beta.9"
    }

Haven't had time to look in to it, (just saw that there where a new version out a few min ago and only have time to test quick before fixing food! hehe)...

Edit:

Running on windows 10 pro (latest stable) and have only tested with node built for windows, will try on linux later too and see.
node -v: v14.5.0
npm -v: 6.14.5

alexander-akait · 2020-09-21T16:15:49Z

You don't need @webpack-cli/serve, it is built-in feature

Johannestegner · 2020-09-21T16:17:43Z

You don't need @webpack-cli/serve, it is built-in feature

Even without I still get the same errors :/
Will check if I can figure out why when I'm done with food :)

alexander-akait · 2020-09-21T16:19:45Z

Just note - replace optimize-css-assets-webpack-plugin on https://github.com/webpack-contrib/css-minimizer-webpack-plugin (there are bugs in architecture)

Johannestegner · 2020-09-21T19:41:07Z

Okay, after deleting node_modules and package files a couple of times and reinstalling and all that fun stuff I now get the following error:

> cross-env NODE_ENV=development webpack-cli serve

[webpack-cli] Promise rejection: TypeError: cli.commandLineArgs is not a function
[webpack-cli] TypeError: cli.commandLineArgs is not a function
    at Object.serve [as default] (D:\Repositories\js\testing-stuff\node_modules\@webpack-cli\serve\lib\index.js:25:31)
    at Function.run (D:\Repositories\js\testing-stuff\node_modules\webpack-cli\lib\commands\ExternalCommand.js:37:51)
    at Command.<anonymous> (D:\Repositories\js\testing-stuff\node_modules\webpack-cli\lib\utils\arg-parser.js:31:73)
    at Command.listener [as _actionHandler] (D:\Repositories\js\testing-stuff\node_modules\webpack-cli\node_modules\commander\index.js:426:31)
    at Command._parseCommand (D:\Repositories\js\testing-stuff\node_modules\webpack-cli\node_modules\commander\index.js:1002:14)
    at Command._dispatchSubcommand (D:\Repositories\js\testing-stuff\node_modules\webpack-cli\node_modules\commander\index.js:953:18)
    at Command._parseCommand (D:\Repositories\js\testing-stuff\node_modules\webpack-cli\node_modules\commander\index.js:970:12)
    at Command.parse (D:\Repositories\js\testing-stuff\node_modules\webpack-cli\node_modules\commander\index.js:801:10)
    at argParser (D:\Repositories\js\testing-stuff\node_modules\webpack-cli\lib\utils\arg-parser.js:132:27)
    at runCLI (D:\Repositories\js\testing-stuff\node_modules\webpack-cli\lib\bootstrap.js:25:24)

It does seem to be kind'a true, the cli.commandLineArgs property is not a function, it actually does not exist in the ../lib/webpack-cli.js file. I'm kinda wondering if something is wrong in the compilation of the script/s?

If you look at the index.ts file in the serve package, it calls the parseArgs method, which is not done in the actual package (which seems to be 1.0.1-alpha.5 when not including it in package file and allowing it to be installed with webpack-cli instead).

Changing to use argParser (which is what happens in the TS files) produces further errors.

Is the package installed with webpack-cli the correct package?

anshumanv · 2020-09-21T19:45:21Z

Yep this is known, #1814

Releasing of sub packages should solve this, I think @evilebottnawi / @evenstensberg is already on this

Johannestegner · 2020-09-21T19:54:57Z

Aah, i see! That's good to hear, just built the latest serve version to test (from the next branch). Other than having to install webpack-dev-server (which I'm guessing is bundled in the 'real' installation) and comment out some of the configuration, it seems to run fine!

So I eagerly await the release of next serve version :)

Edit:
Just sucks that NPM seems to be down! ;D

ylemkimon · 2020-09-23T21:43:42Z

I can confirm that this issue is fixed with webpack@5.0.0-rc.0 and webpack-cli@4.0.0-rc.0.

alexander-akait · 2020-09-24T10:46:56Z

Let's close, feel free to open a new issue if you faced with the issue again with reproducible test repo

anshumanv mentioned this issue Apr 16, 2020

fix: pass devServer args to server options #1470

Closed

alexander-akait mentioned this issue Jun 15, 2020

feature: integration of serve package into cli #1634

Closed

5 tasks

ylemkimon mentioned this issue Jul 17, 2020

[WIP] build: migrate to webpack 5 KaTeX/KaTeX#2318

Closed

alexander-akait closed this as completed Sep 24, 2020

lewisharveydeveloper mentioned this issue Oct 21, 2020

Serve command not passing webpack devServer config to webpack-dev-server #1974

Closed

snyk-bot mentioned this issue Sep 15, 2021

[Snyk] Security upgrade yargs from 13.2.4 to 15.0.1 dhruvdutt/webpack-cli#3

Open

snyk-bot mentioned this issue Sep 16, 2021

[Snyk] Fix for 1 vulnerabilities enterstudio/webpack-cli#21

Open

enterstudio mentioned this issue Jun 20, 2022

[Snyk] Security upgrade got from 6.7.1 to 11.8.5 enterstudio/webpack-cli#24

Open

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Serve command not passing webpack `devServer` config to webpack-dev-server #1469

Serve command not passing webpack `devServer` config to webpack-dev-server #1469

lukereative commented Apr 15, 2020 •

edited

Loading

anshumanv commented Apr 16, 2020

anshumanv commented Apr 16, 2020

anshumanv commented Apr 16, 2020

anshumanv commented Apr 16, 2020 •

edited

Loading

alexander-akait commented Jun 19, 2020

anshumanv commented Jun 19, 2020

alexander-akait commented Jun 19, 2020

anshumanv commented Jun 19, 2020

lukereative commented Jun 30, 2020

gabriel-peracio commented Aug 3, 2020

ylemkimon commented Aug 31, 2020 •

edited

Loading

Johannestegner commented Sep 10, 2020

gabriel-peracio commented Sep 17, 2020

Johannestegner commented Sep 17, 2020

gabriel-peracio commented Sep 21, 2020

Johannestegner commented Sep 21, 2020 •

edited

Loading

alexander-akait commented Sep 21, 2020

Johannestegner commented Sep 21, 2020

alexander-akait commented Sep 21, 2020

Johannestegner commented Sep 21, 2020

anshumanv commented Sep 21, 2020 •

edited

Loading

Johannestegner commented Sep 21, 2020 •

edited

Loading

ylemkimon commented Sep 23, 2020

alexander-akait commented Sep 24, 2020 •

edited

Loading

Serve command not passing webpack devServer config to webpack-dev-server #1469

Serve command not passing webpack devServer config to webpack-dev-server #1469

Comments

lukereative commented Apr 15, 2020 • edited Loading

webpack.dev.js

command used

Relevant entries from package.json

anshumanv commented Apr 16, 2020

anshumanv commented Apr 16, 2020

anshumanv commented Apr 16, 2020

anshumanv commented Apr 16, 2020 • edited Loading

alexander-akait commented Jun 19, 2020

anshumanv commented Jun 19, 2020

alexander-akait commented Jun 19, 2020

anshumanv commented Jun 19, 2020

lukereative commented Jun 30, 2020

gabriel-peracio commented Aug 3, 2020

ylemkimon commented Aug 31, 2020 • edited Loading

Johannestegner commented Sep 10, 2020

gabriel-peracio commented Sep 17, 2020

Johannestegner commented Sep 17, 2020

gabriel-peracio commented Sep 21, 2020

Johannestegner commented Sep 21, 2020 • edited Loading

alexander-akait commented Sep 21, 2020

Johannestegner commented Sep 21, 2020

alexander-akait commented Sep 21, 2020

Johannestegner commented Sep 21, 2020

anshumanv commented Sep 21, 2020 • edited Loading

Johannestegner commented Sep 21, 2020 • edited Loading

ylemkimon commented Sep 23, 2020

alexander-akait commented Sep 24, 2020 • edited Loading

Serve command not passing webpack `devServer` config to webpack-dev-server #1469

Serve command not passing webpack `devServer` config to webpack-dev-server #1469

lukereative commented Apr 15, 2020 •

edited

Loading

Relevant entries from `package.json`

anshumanv commented Apr 16, 2020 •

edited

Loading

ylemkimon commented Aug 31, 2020 •

edited

Loading

Johannestegner commented Sep 21, 2020 •

edited

Loading

anshumanv commented Sep 21, 2020 •

edited

Loading

Johannestegner commented Sep 21, 2020 •

edited

Loading

alexander-akait commented Sep 24, 2020 •

edited

Loading