当前位置：主页 > 查看内容

vue cli3 实现分环境打包的步骤

发布时间：2021-09-17 00:00| 有 位朋友查看

简介：用cli3搭建的vue项目号称零配置文件，为了方便打包（不用手动来回改不同环境进行打包）那么我们在需要打包的时候分不同环境打包怎么办呢 1.在根目录下创建三个配置文件，如下图 这里我创建了三个，这三个分别是我的 本地；离线；线上环境 ，三个文件的内容依……

用cli3搭建的vue项目号称零配置文件，为了方便打包（不用手动来回改不同环境进行打包）那么我们在需要打包的时候分不同环境打包怎么办呢
1.在根目录下创建三个配置文件，如下图

在这里插入图片描述

这里我创建了三个，这三个分别是我的 本地；离线；线上环境 ，三个文件的内容依次为下VUE_APP_TITLE要对应当前文件后缀，build 对应的production

NODE_ENV = 'production'
VUE_APP_TITLE = 'alpha'
====================================================================
NODE_ENV = 'production'
VUE_APP_TITLE = 'production'
====================================================================
NODE_ENV = 'production'
VUE_APP_TITLE = 'online'

2.package.json配置对应环境打包名称，如图所示：

在这里插入图片描述

3.如图所示

在这里插入图片描述

4.在接口拦截文件，如图所示：

在这里插入图片描述

5.配置完以后三个环境打打包方式分别如下：
app打包离线环境：npm run alpha
app打包本地环境：npm run build
app打包正式环境：npm run online

到此这篇关于vue cli3 实现分环境打包的步骤的文章就介绍到这了,更多相关vue cli3 分环境打包内容请搜索站长技术以前的文章或继续浏览下面的相关文章希望大家以后多多支持站长技术！


原文链接：https://m.jb51.net/article/207469.htm
本站部分内容转载于网络，版权归原作者所有，转载之目的在于传播更多优秀技术内容，如有侵权请联系QQ/微信：153890879删除，谢谢！
上一篇：微信小程序开发篇之踩坑记录 下一篇：没有了

推荐图文

  • 周排行
  • 月排行
  • 总排行

随机推荐