Vue 项目分环境打包的方法示例


Posted in Javascript onAugust 03, 2018

我们开发项目的时候,用vue-cli 2.x版本新建的项目,只有dev, pro两种开发环境, 有时需要个test环境来给测试使用,所以找了很多方法,总结了个最简单的方法来给大家使用

1、package.json

在build下面添加一个test运行命令

"test": "node build/build.js"

Vue 项目分环境打包的方法示例

2、prod.env.js

在config -> prod.env.js 中修改代码

'use strict'
 // 读取系统运行时候的变量
 const target = process.env.npm_lifecycle_event;
 // 控制台日志输出
 console.log('env is deploying, current env is', target)
 // 判断环境变量,是test,还是build
 if (target == 'test') {
  var obj = {
   NODE_ENV: '"production"',
   API_ROOT: '"此处替换为测试环境地址"',
  }
 } else {
  var obj = {
   NODE_ENV: '"production"',
   API_ROOT: '"此处替换为测试环境地址"',
  }
 }
  
 module.exports = obj;

3.测试环境:

$ npm run test

正式环境:

```
$ npm run build
```

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
纯js实现的论坛常用的运行代码的效果
Jul 15 Javascript
javascript让setInteval里的函数参数中的this指向特定的对象
Jan 31 Javascript
Dom在ajax技术中的作用说明
Oct 25 Javascript
JS控件的生命周期介绍
Oct 22 Javascript
jquery文字上下滚动的实现方法
Mar 22 Javascript
jquery dialog open后,服务器端控件失效的快速解决方法
Dec 19 Javascript
jQuery简单实现banner图片切换
Jan 02 Javascript
js编写一个简单的产品放大效果代码
Jun 27 Javascript
JCrop+ajaxUpload 图像切割上传的实例代码
Jul 20 Javascript
解决使用bootstrap的dropdown部件时报错:error:Bootstrap dropdown require Popper.js问题
Aug 30 Javascript
Electron 如何调用本地模块的方法
Feb 01 Javascript
Node.js中console.log()输出彩色字体的方法示例
Dec 01 Javascript
如何在vue里添加好看的lottie动画
Aug 02 #Javascript
原生js实现form表单序列化的方法
Aug 02 #Javascript
详解基于Vue2.0实现的移动端弹窗(Alert, Confirm, Toast)组件
Aug 02 #Javascript
详解vue指令与$nextTick 操作DOM的不同之处
Aug 02 #Javascript
vue组件挂载到全局方法的示例代码
Aug 02 #Javascript
原生js封装的ajax方法示例
Aug 02 #Javascript
JS实现根据指定值删除数组中的元素操作示例
Aug 02 #Javascript
You might like
apache和php之间协同工作的配置经验分享
2013/04/08 PHP
PHP中使用php://input处理相同name值的表单数据
2015/02/03 PHP
PHP实现基于栈的后缀表达式求值功能
2017/11/10 PHP
php多进程应用场景实例详解
2019/07/22 PHP
PHP实现基本留言板功能原理与步骤详解
2020/03/26 PHP
JavaScript 学习笔记(十三)Dom创建表格
2010/01/21 Javascript
基于jQuery的消息提示插件之旅 DivAlert(三)
2010/04/01 Javascript
JS 模态对话框和非模态对话框操作技巧汇总
2013/04/15 Javascript
jquery ajax 简单范例(界面+后台)
2013/11/19 Javascript
js鼠标点击图片切换效果实现代码
2015/11/19 Javascript
jQuery Mobile动态刷新页面样式的实现方法
2016/05/28 Javascript
清除浏览器缓存的几种方法总结(必看)
2016/12/09 Javascript
Vue动态实现评分效果
2017/05/24 Javascript
javascript Function函数理解与实战
2017/12/01 Javascript
ztree加载完成后显示勾选节点的实现代码
2018/10/22 Javascript
Vue.js 使用v-cloak后仍显示变量的解决方法
2018/11/19 Javascript
在node中使用jwt签发与验证token的方法
2019/04/03 Javascript
纯javascript实现选择框的全选与反选功能
2019/04/08 Javascript
js时间戳转yyyy-MM-dd HH-mm-ss工具类详解
2019/04/30 Javascript
vue 中 命名视图的用法实例详解
2019/08/14 Javascript
javascript实现视频弹幕效果(两个版本)
2019/11/28 Javascript
[44:15]国士无双DOTA2 6.82版本详解(上)
2014/09/28 DOTA
[02:02:38]VG vs Mineski Supermajor 败者组 BO3 第一场 6.6
2018/06/07 DOTA
[01:04:39]OG vs Mineski 2018国际邀请赛小组赛BO2 第二场 8.17
2018/08/18 DOTA
python中函数传参详解
2016/07/03 Python
python运行其他程序的实现方法
2017/07/14 Python
Win7下Python与Tensorflow-CPU版开发环境的安装与配置过程
2018/01/04 Python
python将回车作为输入内容的实例
2018/06/23 Python
pycharm下查看python的变量类型和变量内容的方法
2018/06/26 Python
对python读写文件去重、RE、set的使用详解
2018/12/11 Python
python实现的多任务版udp聊天器功能案例
2019/11/13 Python
Python 实现Image和Ndarray互相转换
2020/02/19 Python
CSS3实现时间轴效果
2016/07/11 HTML / CSS
跑步、骑行和铁人三项的高性能眼镜和服装:ROKA
2018/07/06 全球购物
.NET方向面试题
2014/11/20 面试题
入党政审材料范文
2014/12/24 职场文书