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 相关文章推荐
关于跨站脚本攻击问题
Dec 22 Javascript
javascript获取鼠标点击元素对象(示例代码)
Dec 20 Javascript
javascript的document.referrer浏览器支持、失效情况总结
Jul 18 Javascript
详解Javascript 装载和执行
Nov 17 Javascript
javascript比较两个日期相差天数的方法
Jul 24 Javascript
理解javascript对象继承
Apr 17 Javascript
jQuery实现移动端手机商城购物车功能
Sep 24 Javascript
详解Angular 4.x Injector
May 04 Javascript
vue的toast弹窗组件实例详解
May 14 Javascript
angular2实现统一的http请求头方法
Aug 13 Javascript
vue实现一个炫酷的日历组件
Oct 08 Javascript
页面内锚点定位及跳转方法总结(推荐)
Apr 24 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运行模式的深入理解
2013/06/03 PHP
PHP模拟asp中response类实现方法
2015/08/08 PHP
php自定义函数实现汉字转换utf8编码的方法
2016/09/29 PHP
Prototype Hash对象 学习
2009/07/19 Javascript
理解Javascript_10_对象模型
2010/10/16 Javascript
JavaScript中的关键字"VAR"使用详解 分享
2013/07/31 Javascript
Jquery自定义button按钮的几种方法
2014/06/11 Javascript
javascript跨域总结之window.name实现的跨域数据传输
2015/11/01 Javascript
分享我的jquery实现下拉菜单心的
2015/11/29 Javascript
多个js毫秒倒计时同时进行效果
2016/01/05 Javascript
原生js仿jquery一些常用方法(必看篇)
2016/09/20 Javascript
jQuery如何解决IE输入框不能输入的问题
2016/10/08 Javascript
AngularJS路由实现页面跳转实例
2017/03/03 Javascript
bootstrap实现的自适应页面简单应用示例
2017/03/09 Javascript
使用JS组件实现带ToolTip验证框的实例代码
2017/08/23 Javascript
简易Vue评论框架的实现(父组件的实现)
2018/01/08 Javascript
JS一次前端面试经历记录
2020/03/19 Javascript
python正则表达式去掉数字中的逗号(python正则匹配逗号)
2013/12/25 Python
python实现简单的TCP代理服务器
2014/10/08 Python
Python编码类型转换方法详解
2016/07/01 Python
python3 实现函数写文件路径的正确方法
2019/11/27 Python
pytorch模型存储的2种实现方法
2020/02/14 Python
Python各种扩展名区别点整理
2020/02/27 Python
python中Array和DataFrame相互转换的实例讲解
2021/02/03 Python
Brookstone美国官网:独特新奇产品
2017/03/04 全球购物
Otticanet美国:最顶尖的世界名牌眼镜, 能得到打折季的价格
2019/03/10 全球购物
初始化了一个没有run()方法的线程类,是否会出错?
2014/03/27 面试题
环境科学专业个人求职信
2013/12/15 职场文书
企业军训感言
2014/02/08 职场文书
驾驶员培训方案
2014/05/01 职场文书
2014教师教育实践活动对照检查材料思想汇报
2014/09/21 职场文书
小学向国旗敬礼活动方案
2014/09/27 职场文书
群众路线教育实践活动整改落实情况汇报
2014/10/28 职场文书
婚姻出轨保证书
2015/05/08 职场文书
python urllib库的使用详解
2021/04/13 Python
详解PHP用mb_string处理windows中文字符
2021/05/26 PHP