Vue-cli: When vue.config.js set devServer.open to true it will open twice.

[Lanseria]

Version

3.8.2

Environment info

Environment Info:

  System:
    OS: Windows 10
    CPU: (16) x64 AMD Ryzen 7 2700X Eight-Core Processor
  Binaries:
    Node: 10.15.3 - C:\Program Files\nodejs\node.EXE
    Yarn: 1.16.0 - C:\Users\lanseria\AppData\Roaming\npm\yarn.CMD
    npm: 6.4.1 - C:\Program Files\nodejs\npm.CMD
  Browsers:
    Edge: 44.17763.1.0
  npmPackages:
    @vue/babel-helper-vue-jsx-merge-props:  1.0.0
    @vue/babel-plugin-transform-vue-jsx:  1.0.0
    @vue/babel-preset-app:  3.8.0
    @vue/babel-preset-jsx:  1.0.0
    @vue/babel-sugar-functional-vue:  1.0.0
    @vue/babel-sugar-inject-h:  1.0.0
    @vue/babel-sugar-v-model:  1.0.0
    @vue/babel-sugar-v-on:  1.0.0
    @vue/cli-overlay:  3.8.0
    @vue/cli-plugin-babel: ^3.8.0 => 3.8.0
    @vue/cli-plugin-eslint: ^3.8.0 => 3.8.0
    @vue/cli-service: ^3.8.0 => 3.8.0
    @vue/cli-shared-utils:  3.8.0
    @vue/component-compiler-utils:  2.6.0
    @vue/preload-webpack-plugin:  1.1.0
    @vue/web-component-wrapper:  1.2.0
    eslint-plugin-vue: ^5.0.0 => 5.2.2 (4.7.1)
    vue: ^2.6.10 => 2.6.10
    vue-eslint-parser:  5.0.0 (2.0.3)
    vue-hot-reload-api:  2.3.3
    vue-loader:  15.7.0
    vue-style-loader:  4.1.2
    vue-template-compiler: ^2.6.10 => 2.6.10
    vue-template-es2015-compiler:  1.9.1
  npmGlobalPackages:
    @vue/cli: Not Found

Steps to reproduce

vue create test
// create vue.config.js and sets devServer.host to ''0.0.0.0' and sets devServer.open: true, Then
yarn serve
// url: http://0.0.0.0:8080 quickly opened but unused
When compiled, url: http://localhost:8080/ opened

What is expected?

At least not pop up twice

What is actually happening?

Pop up twice, and the first time there is no response, the second IP address does not apply

[trickstival]

It's easy to reproduce.
I think the problem is somehow related to this line:
https://github.com/vuejs/vue-cli/blob/500dc5020517f8d5780ce1ef85f9c74abc0c184c/packages/%40vue/cli-service/lib/util/prepareURLs.js#L33

Since you want to open it in 0.0.0.0 should it be prettified? Removing this validation should close the issue

[trickstival]

I checked that the open function: https://github.com/vuejs/vue-cli/blob/500dc5020517f8d5780ce1ef85f9c74abc0c184c/packages/%40vue/cli-shared-utils/lib/openBrowser.js#L99 is just called once. Perhaps that's a problem with the 'open' package

[xovel]

I'm confused about it too.

Is there any solution?

[trickstival]

I don't see the reason for prettyfying the host address. If the user has set one, it should open a browser tab with exactly that.

But still, the real bug is in the "open" npm package, not in vue cli.

[xovel]

Finally, I figure it out. It seems ironicly.

[xovel]

The bug is not in open or opn package, but in webpack-dev-server. May it not a bug, just a strategy.

[trickstival]

I was wrong. Is there any explanation for this behaviour?

[sodatea]

Previously open option for webpack-dev-server only works with its own CLI. https://github.com/webpack/webpack-dev-server/pull/1863 Now it also respects this flag passed via its Node API.