Vue项目本地运行设置自动打开浏览器

最新推荐文章于 2023-04-14 18:04:31 发布
最新推荐文章于 2023-04-14 18:04:31 发布
阅读量408 收藏
点赞数 1
分类专栏： vue 文章标签： vue vue.js 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/Fansr_/article/details/119794689
版权

目前统计了三种可操作的方法,仅供参考:

一、在package.json文件中的scripts下的serve属性后面增加--open

"scripts":{

        "serve":"vue-cli-service --open",

},

二、在config文件夹下面的index.js文件中设置(VueCli2)

autoOpenBrowser:true,

三、在vue.config.js文件中devServer这是open为true(VueCli3+)

devServer:{

        open:true,

},

Fansr_
关注
  • 1
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
如何运行一个Vue项目
01-20
当命令执行成功后，它会提供一个本地URL，例如`http://localhost:8080`，将这个地址复制到浏览器中，你就能看到项目运行起来了。 Vue项目运行的整个流程大致就是这样。了解并熟悉这些步骤对于前端开发者来说至关...
Vue项目获取本地ip，并打开浏览器
BMG-Princess
03-13 1024
config/index.js里找到autoOpenBrowser将其设为true 在config/index.js 顶部添加: const os = require(‘os’) let localhost = ‘’ try { const network = os.networkInterfaces() localhost = network[Object.keys(network)[0]][1...
windows环境下，vue启动项目后打开chrome浏览器
in_the_road的博客
02-19 3129
windows环境下，vue启动项目后打开chrome浏览器
vue2 -- vue3项目自动打开
HQ\(^o^)/的博客
07-06 422
vue2 和vue3 自动启动项目
vue.config.js
总柴的博客
02-01 141
const path = require("path"); module.exports = { // 部署应用包时的基本 URL,用法和 webpack 本身的 output.publicPath 一致 publicPath: "./", // 输出文件目录 outputDir: "dist", // eslint-loader 是否在保存的时候检查 lintOnSave: true, // 是否使用包含运行时编译器的 Vue 构建版本 runtimeCompiler:
如何让Vue2项目启动脚手架后，自动打开
qq_48306453的博客
04-14 232
在package.json中，serve末尾加上 --open 表示启动脚手架时，自动打开
package.json配置运行命令
最新发布
m0_54741495的博客
04-14 3054
npm init之后,会生成一个package.json的文件,这里面有个scripts的属性,里面可以配置项目的运行命令,比如我们常见的vue脚手架终会自带serve和build的命令.配置了命令,既可以让我们选择代码运行的配置,也可以方便每次运行,不需要敲很长的命令.在这里我就简单的记录一下常用的配置项如果是start,那么就直接npm start就可以运行,如果是其他名称,比如dev,那么就需要npm run dev这样的命令去运行,这里我统一用start去命名 实时运行(文件变化就自动重启)
vscode新建一个最简单的vue项目
09-27
打开命令行工具，进入刚刚创建的`vue-test`目录，然后运行以下命令来初始化一个新的Vue项目： ```bash vue create vue-test ``` 这将启动Vue CLI（命令行界面），引导你选择项目配置。对于初学者，你可以选择...
详解VSCode配置启动Vue项目
10-17
在同一个终端窗口中输入`npm run dev`，这将启动项目，并自动在默认浏览器中打开。如果一切配置正确，你应该能看到Vue项目的运行效果，这标志着你的VSCode已经成功配置为开发Vue项目的工作环境。 在开发过程中，...
Vue 打包的静态文件不能直接运行的原因及解决办法
01-22
然而在使用 npm run build 打包项目时，却发现打包好的项目在浏览器中直接打开好像什么都没有？ 原因 查看了一下打包后的 index.html 源码，终于发现了一个重要的点： 所有涉及到路径的地方全都是以 / 开头的 下面...
通过命令行创建vue项目的方法
08-29
这将在本地启动一个热加载的开发服务器，并在浏览器中打开项目。默认情况下，项目会在`http://localhost:8080`上运行。 5. **查看效果**： 在浏览器中输入`http://localhost:8080`，你将看到新创建的Vue项目的...
Vue 运行后自动打开浏览器的解决办法（vuecli2和vuecli3+的区别）
窝窝头的博客
11-06 2694
一、Vue+JavaScript需要项目npm run dev运行后自动打开浏览器（VueCli2） 1.1、版本说明 "vue": "^2.5.2" "vue-router": "^3.0.1" vuecli2 1.2、修改项目目录下/config/index.js文件，设置dev.autoOpenBrowser为true即可 dev: { // P...
vue+h5做的App使用api进行文件的下载自动安装打开
七岁。
05-15 5250
        本人第一次写博客，菜鸟一只，也不大会用语言表述，写博客只是单纯记录下自己遇到的问题，并且记录下来以便日后使用的时候可以有个思路。如果能够帮助到别人就更好了。        现在公司的项目需要用vue做一个安卓app，需要实现app的自动更新功能。我的设计方案就是打开App先提交请求到后台，需要更新会返回下载地址。创建下载的代码：         // 下载最新版本 JX_do...
package.json文件中的scripts配置
weixin_62790313的博客
02-25 742
package.json文件的理解
Vue 项目运行完成后自动打开浏览器【多种方法】
qq_22841387的博客
02-20 5087
1.打开package.json 在文件中找到scripts–serve，在后面添加 --open 保存后，再次重新启动项目即可！
npm启动vue应用开发服务器过程分析
qzonemen的专栏
09-29 5021
npm run 命令执行时，会把./node_modules/.bin目录添加到执行环境的PATH变量中。全局的没有安装的包，在node_modules中安装了，通过npm run 可以调用该命令。打开./node_modules/.bin 目录，我们看到了很多执行脚本，包括我们认识的。
vue-cli-service serve --open启动项目时打开浏览器失效无法打开浏览器解决方法
山前山后各有哀愁 有风无风都不自由
03-24 2468
vue-cli 运行vue项目，设置 vue-cli-service serve --open 自动打开浏览器失效，npm run serve无法启动浏览器
设置Vue启动自动打开Chrome
^_^TaeYang-Jade^_^
04-17 1583
以下为windows 系统操作，仅供参考。 一、修改默认浏览器 个人偏好谷歌浏览器，设置谷歌浏览器为默认浏览器。 1、首先打开“开始菜单”，点击“控制面板”； 2、在“控制面板”里面找到“默认程序”，进入后点击“设置默认程序”； 3、加载好后选择 “谷歌浏览器”； 4、选择“将此程序设置为默...
vue配置启动项目自动打开浏览器(三种方法)
热门推荐
Billow_lamb的博客
02-24 1万+
vue配置启动项目自动打开浏览器 1.找到项目中的config文件夹内的index.js，里面有一个配置是autoOpenBrowser:false； 设置为true即可(或者全局搜索autoOpenBrowser设置为true) 2.打开package.json找到启动命令npm run dev 跟npm run serve(这两种命令都可以) 后面增加 --open 3.在根目录下新建vue.config.js文件 vue.config.js代码如下 module.exports = { d

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值