vue-cli3 运行vue项目,设置vue-cli-service serve --open自动打开浏览器,跳转到http://0.0.0.0:8081 解决办法

使用版本:

img

尝试在 package.json 里面设置自动打开浏览器

"scripts": {
    "serve": "vue-cli-service serve --open",
}

运行之后 跳转到 http://0.0.0.0:8081,界面不能显示

img

搜集了很多资料,发现我的文件夹里面根本没有config/index.js 这个文件,然后参考了这两篇文章
https://blog.csdn.net/Winsom1/article/details/105828574
https://blog.csdn.net/QinTao9961220/article/details/122236023

在 项目文件夹下的 vue.config.js (我本来就有文件,没有这个文件就参照上面第二个链接建一个)里面添加了这段代码

module.exports = {
  devServer: {
    disableHostCheck: false,           
    host: 'localhost',
    port: 8081,
    https: false,
    hotOnly: false,
    proxy: null
  },
};

试着运行,然后报错了

ValidationError: Invalid options object. Dev Server has been initialized using an options object that does not match the API schema.
 - options has an unknown property 'hotOnly'. These properties are valid:
   object { allowedHosts?, bonjour?, client?, compress?, devMiddleware?, headers?, historyApiFallback?, host?, hot?, http2?, https?, ipc?, liveReload?, magicHtml?, onAfterS
etupMiddleware?, onBeforeSetupMiddleware?, onListening?, open?, port?, proxy?, server?, setupExitSignals?, setupMiddlewares?, static?, watchFiles?, webSocketServer? }

读了一下错误发现是参数不匹配,参数列表里面没有disableHostCheck和hotOnly参数,然后把disableHostCheck删掉,hotOnly改成hat就可以了,运行之后就能自动打开浏览器了

img

img

也应该显示 localhost:8080 这样的 或者 你电脑 ip :8080

0.0.0.0肯定不行

你不是解决了吗?发错地方了吧 。发成博客

感谢博主,已解决。但是hotOnly应该改成hot

感谢,看的尚硅谷的视频配置,也是发生一样的情况,按照博主的配置就好了,写的很清晰

感谢!!