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 相关文章推荐
表单元素事件 (Form Element Events)
Jul 17 Javascript
JQuery的ajax获取数据后的处理总结(html,xml,json)
Jul 14 Javascript
Javascript获取窗口(容器)的大小及位置参数列举及简要说明
Dec 09 Javascript
js实现带圆角的多级下拉菜单效果
Aug 28 Javascript
怎么限制input的text里输入的值只能是数字(正则、js)
May 16 Javascript
Node Puppeteer图像识别实现百度指数爬虫的示例
Feb 22 Javascript
vue.js使用v-pre与v-html输出HTML操作示例
Jul 07 Javascript
基于Vue2实现简易的省市区县三级联动组件效果
Nov 05 Javascript
微信小程序获取用户绑定手机号方法示例
Jul 21 Javascript
vue element 中的table动态渲染实现(动态表头)
Nov 21 Javascript
JS插入排序简单理解与实现方法分析
Nov 25 Javascript
jQuery带控制按钮轮播图插件
Jul 31 jQuery
如何在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出错界面
2006/10/09 PHP
PHP的开合式多级菜单程序
2006/10/09 PHP
php中通过Ajax如何实现异步文件上传的代码实例
2011/05/07 PHP
php防止sql注入简单分析
2015/03/18 PHP
如何使用php实现评委评分器
2015/07/31 PHP
PHP模板引擎Smarty中的保留变量用法分析
2016/04/11 PHP
JS+PHP实现用户输入数字后显示最大的值及所在位置
2017/06/19 PHP
仿百度的关键词匹配搜索示例
2013/09/25 Javascript
jquery插件tooltipv顶部淡入淡出效果使用示例
2013/12/05 Javascript
js实现键盘操作实现div的移动或改变的原理及代码
2014/06/23 Javascript
jQuery双向列表选择器select版
2016/11/01 Javascript
Javascript 实现放大镜效果实例详解
2016/12/03 Javascript
浅谈JS 数字和字符串之间相互转化的纠纷
2017/10/20 Javascript
浅析node Async异步处理模块用例分析及常用方法介绍
2017/11/17 Javascript
基于vue+canvas的excel-like组件实例详解
2017/11/28 Javascript
Node.js利用console输出日志文件的方法示例
2018/04/27 Javascript
Vue+webpack项目配置便于维护的目录结构教程详解
2018/10/14 Javascript
jQuery.parseJSON()函数详解
2019/02/28 jQuery
详解Python中映射类型的内建函数和工厂函数
2015/08/19 Python
Python学习笔记之解析json的方法分析
2017/04/21 Python
django模型层(model)进行建表、查询与删除的基础教程
2017/11/21 Python
Python实现非正太分布的异常值检测方式
2019/12/09 Python
python实现上传文件到linux指定目录的方法
2020/01/03 Python
在Matplotlib图中插入LaTex公式实例
2020/04/17 Python
TensorFlow使用Graph的基本操作的实现
2020/04/22 Python
用python对excel查重
2020/12/07 Python
css3中background新增的4个新的相关属性用法介绍
2013/09/26 HTML / CSS
html5调用app分享功能示例(WebViewJavascriptBridge)
2018/03/21 HTML / CSS
设计师珠宝:Ylang 23
2018/05/11 全球购物
军用级手机壳,专为冒险而建:Zizo Wireless
2019/08/07 全球购物
《小儿垂钓》教学反思
2014/02/23 职场文书
食品安全工作方案
2014/05/07 职场文书
小学生我的梦想演讲稿
2014/08/21 职场文书
公务员保密工作承诺书
2015/05/04 职场文书
2016年圣诞节活动总结范文
2016/04/01 职场文书
Oracle11g r2 卸载干净重装的详细教程(亲测有效已重装过)
2021/06/04 Oracle