vue-cli3启动服务如何自动打开浏览器配置

 更新时间:2022年09月05日 10:02:39   作者:Hello_yihao  
这篇文章主要介绍了vue-cli3启动服务如何自动打开浏览器配置,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教

vue-cli3启动服务自动打开浏览器配置

1.首先创建一个vue-cli3项目。

2.找到package.json文件

3.找到配置项‘scripts’

4.找到配置项‘serve’

5.修改下,加个字段 “serve”: “vue-cli-service serve --open”

在这里插入图片描述

如果不想每次默认打开浏览器还可以将上图中的 --open,替换成 --copy (将本地 URL 复制到剪切板)

附:vue-cli3官方文档配置

vue-cli自动打开默认浏览器0.0.0:8080

最近重新启了个项目,发现使用- -open时打开浏览器访问的是0.0.0:8080,然后上网搜到了解决办法,记录一下:

在vue.config.js中加上devServer这一段:

const { defineConfig } = require('@vue/cli-service')
module.exports = defineConfig({
  transpileDependencies: true,
  devServer:{
    open:true,
    host:'localhost',
    port:8080
  }
})

以上为个人经验,希望能给大家一个参考,也希望大家多多支持脚本之家。

相关文章

  • 浅谈vue项目打包优化策略

    浅谈vue项目打包优化策略

    这篇文章主要介绍了浅谈vue项目打包优化策略,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2018-09-09
  • vue项目实现一键网站换肤效果实例(webpack-theme-color-replacer的使用)

    vue项目实现一键网站换肤效果实例(webpack-theme-color-replacer的使用)

    换皮肤一般都是点击一个按钮弹出一些皮肤的选项,选中选项后皮肤生效,下面这篇文章主要给大家介绍了关于vue项目实现一键网站换肤效果的相关资料,文中主要介绍的是webpack-theme-color-replacer的使用,需要的朋友可以参考下
    2023-02-02
  • 解决VUE打包后与nginx代理出现加载速度超级慢的问题

    解决VUE打包后与nginx代理出现加载速度超级慢的问题

    这篇文章主要介绍了解决VUE打包后与nginx代理出现加载速度超级慢的问题,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教
    2023-09-09
  • vue函数防抖与节流的正确使用方法

    vue函数防抖与节流的正确使用方法

    防抖和节流的作用都是防止函数多次调用,下面这篇文章主要给大家介绍了关于vue函数防抖与节流的正确使用方法,需要的朋友可以参考下
    2021-05-05
  • Vue生命周期中的组件化你知道吗

    Vue生命周期中的组件化你知道吗

    这篇文章主要为大家详细介绍了Vue生命周期中的组件化,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下,希望能够给你带来帮助
    2022-03-03
  • vue 实现复制内容到粘贴板clipboard的方法

    vue 实现复制内容到粘贴板clipboard的方法

    下面小编就为大家分享一篇vue 实现复制内容到粘贴板clipboard的方法,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2018-03-03
  • vue实现三级页面跳转功能

    vue实现三级页面跳转功能

    这篇文章主要介绍了vue实现三级页面跳转功能,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2023-05-05
  • vue打包chunk-vendors.js文件过大导致页面加载缓慢的解决

    vue打包chunk-vendors.js文件过大导致页面加载缓慢的解决

    这篇文章主要介绍了vue打包chunk-vendors.js文件过大导致页面加载缓慢的解决方案,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2022-04-04
  • 详解Vue CLI3配置解析之css.extract

    详解Vue CLI3配置解析之css.extract

    这篇文章主要介绍了详解Vue CLI3配置解析之css.extract,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2018-09-09
  • Vue 3.0 项目创建过程及解决方案

    Vue 3.0 项目创建过程及解决方案

    这篇文章主要介绍了Vue 3.0 项目创建过程,首先要确保电脑上已安装node.js,确保已安装 Vue CLI,本文结合实例代码给大家介绍的非常详细,需要的朋友可以参考下
    2024-04-04

最新评论