error: option '--open <value>' argument missing

[chenxsan]

As per the request here webpack/webpack.js.org#4099 (comment).

Describe the bug

webpack serve --open throws an error:

error: option '--open <value>' argument missing

What is the current behavior?

To Reproduce

Steps to reproduce the behavior:

1. git clone https://github.com/chenxsan/webpack-demo
2. git checkout 8ffd9d229ce344fb4b595e4045aee7b074be16cc
3. npm install
4. npm start

Expected behavior

Screenshots

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

Additional context

[snitin315]

Thanks for the report. I will look into it in near future.

[webharry]

I have the same problem.

My version information is：

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

[kkbdv]

I have the same probem

[snitin315]

Work in progress

[zero41120]

I was following the tutorial from the official website.

This --open argument bug happened before and there are some stack overflow questions and GitHub issues of the same bug.

If you just like me, trying to learn Webpack and don't care, providing the url allows you to continue:
webpack serve --open Chrome.exe

[snitin315]

This will be fixed with webpack-dev-server version 4.
https://github.com/webpack/webpack-dev-server/blob/9f1d02b909e22ece60dde2e57cbfce14feafde69/bin/cli-flags.js#L47

[cannandev]

Providing a url like @zero41120 said didn't work for me. But, webpack serve --open 'Google Chrome' works. Replace Google Chrome with your browser name.

[snitin315]

Yes, string functionality ( webpack --open 'browser-name') works fine.

[zero41120]

@cannandev @snitin315
Yes. Looks like the --open just opens whatever you provide, for example
webpack serve --open notepad.exe

I think it worked for me because that I'm on windows environment,
and it knows that http uses my default browser.
I will update my original comment.

[zzw890827]

Remove --open option can work if you do not know your browser name. I think it is better to correct it in the official tutorial.

[deleonio]

Please use the default browser by default.

webpack --open - thats it

[Amstrong]

I was following the tutorial from the official website.

This --open argument bug happened before and there are some stack overflow questions and GitHub issues of the same bug.

If you just like me, trying to learn Webpack and don't care, providing the url allows you to continue:
webpack serve --open Chrome.exe

this works for me, thanks you.

[vijayprasanna13]

I had the same issue, but adding the open: true in the devServer block of webpack.config.js, seems to work for me.

  devServer: {
    contentBase: path.join(__dirname, 'dist'),
    port: 9000,
    open: true
  }

[578691200]

I have the same probem

[mihailthebuilder]

Had the same problem, fixed it by just using webpack serve without --open or a browser value. I'd then have to open the browser and go to the localhost server http://localhost:8080/

[Amstrong]

Had the same problem, fixed it by just using webpack serve without --open or a browser value.

Yes, and you can use --open 'nameOfYourBrowser' in my case

--open 'google Chrome'

[Hyuk]

webpack serve --open chrome will fix the issue

[mihailthebuilder]

@Amstrong @Hyuk both your suggestions throw the following error for me:

ℹ ｢wds｣: Project is running at http://localhost:8080/
ℹ ｢wds｣: webpack output is served from undefined
ℹ ｢wds｣: Content not from webpack is served from ./dist
node:events:304
      throw er; // Unhandled 'error' event
      ^

Error: spawn chrome ENOENT
    at Process.ChildProcess._handle.onexit (node:internal/child_process:269:19)
    at onErrorNT (node:internal/child_process:467:16)
    at processTicksAndRejections (node:internal/process/task_queues:80:21)
Emitted 'error' event on ChildProcess instance at:
    at Process.ChildProcess._handle.onexit (node:internal/child_process:275:12)
    at onErrorNT (node:internal/child_process:467:16)
    at processTicksAndRejections (node:internal/process/task_queues:80:21) {
  errno: -2,
  code: 'ENOENT',
  syscall: 'spawn chrome',
  path: 'chrome',
  spawnargs: [ 'http://localhost:8080/' ]
}

This is the repo I'm working on: https://github.com/mihailthebuilder/tech-asia

[alexander-akait]

@martinoppitz you don't have chrome or your browser have another name, we should improve error reporting

[Amstrong]

@mihailthebuilder Can you share the running script in package.json?. I clone your repository to fix the error, and the npm run start works and modify the script by webpack serve --open chrome and works too.

[mihailthebuilder]

@Amstrong the running script in package.json is "start": "webpack serve". npm run start works well as it is, but when I change to "start": "webpack serve --open chrome" I get the error with the command.

[gauravkrp]

"dev-server": "webpack serve --open chrome"

This works for me, on a windows 10 machine with NodeJs 15 and webpack 5

[snitin315]

@gauravkrp can you try with webpack-dev-server@next

[onesmusmuna]

I have removed --open and then opened my browser manually and when to http://localhost:8080/ Now it works just fine.

[buglessir]

remove --open from "start": "webpack serve --open" and add that into your webpack.config.js:

...
devServer: {
    port: 3000,
    host: '127.0.0.1',
    open: true
  },
...

in this case, that opens your default browser

[wilmer11]

Según lo nuevo de webpack en su documentación, a la hora de configurar el webpack-dev-server hay que usar así la estructura del objeto

devServer:{
contentBase: './dist',
compress: true, // este es el importante, puesto que al compilar, resulta con warning ya que le pide comprimir el archivo
open: true,
port: 5000
},

[Amstrong]

Según lo nuevo de webpack en su documentación, a la hora de configurar el webpack-dev-server hay que usar así la estructura del objeto

devServer:{
contentBase: './dist',
compress: true, // este es el importante, puesto que al compilar, resulta con warning ya que le pide comprimir el archivo
open: true,
port: 5000
},

En realidad si, lo puedes lograr así. Solo que cambio la forma explicita como estaba definida la sintaxis.

[MejanH]

Two Ways Worked for me

Thanks to previous answers

1. webpack serve --open msedge
2. webpack serve

First Option will open the link on the browser. So why not?

[chenxsan]

I believe this was already fixed in the latest webpack-cli 4.3.0.

[alexander-akait]

Still valid, will be fixed in 4.3.1

[alexander-akait]

We have big refactor, so I don't have time to fix some bugs, focus on serve and bugs

[alexander-akait]

Fixed, please update webpack-dev-server to 3.11.1