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 相关文章推荐
javascript进行数组追加方法小结
Jun 16 Javascript
js对象继承之原型链继承实例
Jan 10 Javascript
jQuery中$this和$(this)的区别介绍(一看就懂)
Jul 06 Javascript
基于javascript制作经典传统的拼图游戏
Mar 22 Javascript
Bootstrap实现水平排列的表单
Jul 04 Javascript
Javascript将字符串日期格式化为yyyy-mm-dd的方法
Oct 27 Javascript
使用ionic切换页面卡顿的解决方法
Dec 16 Javascript
JavaScript使用原型和原型链实现对象继承的方法详解
Apr 05 Javascript
浅谈angular4 ng-content 中隐藏的内容
Aug 18 Javascript
javascript基本常用排序算法解析
Sep 27 Javascript
JavaScript引用类型Date常见用法实例分析
Aug 08 Javascript
JS中getElementsByClassName与classList兼容性问题解决方案分析
Aug 07 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
PHP中魔术变量__METHOD__与__FUNCTION__的区别
2014/09/29 PHP
Linux操作系统安装LAMP环境
2015/06/26 PHP
php实现图片上传并利用ImageMagick生成缩略图
2016/03/14 PHP
JavaScript实际应用:innerHTMl和确认提示的使用
2006/06/22 Javascript
javascript下判断一个对象是否具有指定名称的属性的的代码
2010/01/11 Javascript
JS 跳转页面延迟2种方法
2013/03/29 Javascript
js在指定位置增加节点函数insertBefore()用法实例
2015/01/12 Javascript
JavaScript中的普通函数与构造函数比较
2015/04/07 Javascript
jquery中checkbox使用方法简单实例演示
2015/11/24 Javascript
JS延时提示框实现方法详解
2015/11/26 Javascript
Javascript数组Array方法解读
2016/03/13 Javascript
JS实现表单验证功能(验证手机号是否存在,验证码倒计时)
2016/10/11 Javascript
浅谈JavaScript的函数及作用域
2016/12/30 Javascript
利用JavaScript如何查询某个值是否数组内
2017/07/30 Javascript
Angular整合zTree的示例代码
2018/01/24 Javascript
JavaScript设计模式之责任链模式实例分析
2019/01/16 Javascript
Layui 动态禁止select下拉的例子
2019/09/03 Javascript
jquery实现上传文件进度条
2020/03/26 jQuery
jQuery实现图片切换效果
2020/10/19 jQuery
将Django框架和遗留的Web应用集成的方法
2015/07/24 Python
python中计算一个列表中连续相同的元素个数方法
2018/06/29 Python
Keras设定GPU使用内存大小方式(Tensorflow backend)
2020/05/22 Python
HTML5之SVG 2D入门12—SVG DOM及DOM操作介绍
2013/01/30 HTML / CSS
解析html5 canvas实现背景鼠标连线动态效果代码
2019/06/17 HTML / CSS
英国网上香水店:Fragrance Direct
2016/07/20 全球购物
澳大利亚最早和最古老的巨型游戏专家:Yardgames
2020/02/20 全球购物
工商治理实习生的自我评价
2014/01/15 职场文书
药剂专业自荐信范文
2014/04/16 职场文书
母亲节演讲稿
2014/05/27 职场文书
求职自我评价范文100字
2014/09/23 职场文书
个人存款证明书
2014/10/18 职场文书
六年级学生评语大全
2014/12/26 职场文书
银行求职自荐信范文
2015/03/04 职场文书
队名及霸气口号大全
2015/12/25 职场文书
三八红旗手先进事迹材料(2016推荐版)
2016/02/25 职场文书
在HTML中引入CSS的几种方式介绍
2021/12/06 HTML / CSS