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 相关文章推荐
很棒的学习jQuery的12个网站推荐
Apr 28 Javascript
jQuery产品间断向下滚动效果核心代码
May 08 Javascript
javascript的日期对象、数组对象、二维数组使用说明
Dec 22 Javascript
JS表的模拟方法
Feb 05 Javascript
Javascript中浏览器窗口的基本操作总结
Aug 18 Javascript
js如何编写简单的ajax方法库
Aug 02 Javascript
使用Vue构建可重用的分页组件
Mar 26 Javascript
默认浏览器设置及vue自动打开页面的方法
Sep 21 Javascript
vue+elementui 对话框取消 表单验证重置示例
Oct 29 Javascript
vue Tab切换以及缓存页面处理的几种方式
Nov 05 Javascript
原生javascript中this几种常见用法总结
Feb 24 Javascript
three.js利用射线Raycaster进行碰撞检测
Mar 12 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
Symfony2联合查询实现方法
2016/03/18 PHP
PHP实现的登录页面信息提示功能示例
2017/07/24 PHP
PHP 7安装使用体验之性能大提升,兼容性强,扩展支持不够(升级PHP要谨慎)
2017/07/27 PHP
PHP生成随机数的方法总结
2018/03/01 PHP
PHP命名空间定义与用法实例分析
2019/08/14 PHP
JavaScript中使用stopPropagation函数停止事件传播例子
2014/08/27 Javascript
使用jQuery实现星级评分代码分享
2014/12/09 Javascript
JQuery选择器绑定事件及修改内容的方法
2015/01/23 Javascript
javascript:void(0)是什么意思及href=#与href=javascriptvoid(0)的区别
2015/11/13 Javascript
JavaScript实现跑马灯抽奖活动实例代码解析与优化(一)
2016/02/16 Javascript
ionic实现底部分享功能
2017/05/11 Javascript
使用mint-ui开发项目的一些心得(分享)
2017/09/07 Javascript
基于ts的动态接口数据配置的详解
2019/12/18 Javascript
jQuery开发仿QQ版音乐播放器
2020/07/10 jQuery
JS中箭头函数与this的写法和理解
2021/01/14 Javascript
[01:05:40]VG vs Newbee 2018国际邀请赛小组赛BO2 第二场 8.17
2018/08/20 DOTA
linux系统使用python监控apache服务器进程脚本分享
2014/01/15 Python
CentOS6.5设置Django开发环境
2016/10/13 Python
python 把数据 json格式输出的实例代码
2016/10/31 Python
Python3.7 pyodbc完美配置访问access数据库
2019/10/03 Python
在OpenCV里实现条码区域识别的方法示例
2019/12/04 Python
canvas压缩图片以及卡片制作的方法示例
2018/12/04 HTML / CSS
雅诗兰黛(Estee Lauder)英国官方网站:世界顶级化妆品牌
2016/12/29 全球购物
欧洲最大的笔和书写专家:The Pen Shop
2017/03/19 全球购物
阿拉伯书店:Jamalon
2019/07/24 全球购物
技术人员面试提纲
2013/11/28 职场文书
八一建军节感言
2014/02/28 职场文书
自荐信的格式
2014/03/10 职场文书
村干部培训方案
2014/05/02 职场文书
秋季运动会开幕词
2015/01/28 职场文书
匿名检举信范文
2015/03/02 职场文书
家装电话营销开场白
2015/05/29 职场文书
国庆阅兵观后感
2015/06/15 职场文书
如何撰写创业策划书
2019/06/27 职场文书
python pyhs2 的安装操作
2021/04/07 Python
python中使用redis用法详解
2022/12/24 Redis