vue-cli项目根据线上环境分别打出测试包和生产包


Posted in Javascript onMay 23, 2018

最近用vue-cli搭建了项目,准备上线时发现脚手架自带的npm run buil只能打出请求生产接口的生产包,但是项目肯定要先上测试环境,怎么用命令行打出请求测试接口的测试包呢?

Step1: package.json中新增命令行脚本test命令,并指向build文件夹下的test.js。

"scripts": {
  "dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js",
  "start": "npm run dev",
  "build": "node build/build.js",
  "test": "node build/test.js"
 },

Step2. 在build文件夹中新建test.js,内容可以直接拷贝同目录build.js内容,修改一些参数。

vue-cli项目根据线上环境分别打出测试包和生产包

这样就多了一个test环境。

Step3. 在build文件夹中新建webpack.test.conf.js,内容可以直接拷贝同目录webpack.prod.conf.js内容,修改一些参数。

vue-cli项目根据线上环境分别打出测试包和生产包

这样构建时就会去config文件夹下的test.env.js寻找环境变量。

Step4.在config文件夹中新建test.env.js,内容可以直接拷贝同目录prod.env.js内容,修改一些参数。

vue-cli项目根据线上环境分别打出测试包和生产包

这样在npm run test 就能打出请求测试接口的测试包了。

可以在dist-->js-->app.js中查看是否打包成功。

vue-cli项目根据线上环境分别打出测试包和生产包

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

Javascript 相关文章推荐
写的htc的数据表格
Jan 20 Javascript
javascript返回顶部效果(自写代码)
Jan 06 Javascript
Jquery Uploadify多文件上传带进度条且传递自己的参数
Aug 28 Javascript
javascript 数组排序函数sort和reverse使用介绍
Nov 21 Javascript
jQuery中的on与bind绑定事件区别实例详解
Feb 28 Javascript
vue中axios处理http发送请求的示例(Post和get)
Oct 13 Javascript
Vue中 key keep-alive的实现原理
Sep 18 Javascript
利用JS动态生成隔行换色HTML表格的两种方法
Oct 09 Javascript
简化版的vue-router实现思路详解
Oct 19 Javascript
vue实现鼠标经过动画
Oct 16 Javascript
Node.js设置定时任务之node-schedule模块的使用详解
Apr 28 Javascript
创建与框架无关的JavaScript插件
Dec 01 Javascript
深入剖析Node.js cluster模块
May 23 #Javascript
Node.js进阶之核心模块https入门
May 23 #Javascript
使用 vue-i18n 切换中英文效果
May 23 #Javascript
centos 上快速搭建ghost博客方法分享
May 23 #Javascript
20个最常见的jQuery面试问题及答案
May 23 #jQuery
AngularJS与BootStrap模仿百度分页的示例代码
May 23 #Javascript
jQuery发请求传输中文参数乱码问题的解决方案
May 22 #jQuery
You might like
php smarty 二级分类代码和模版循环例子
2011/06/01 PHP
PHP获取POST数据的几种方法汇总
2015/03/03 PHP
PHP 文件上传限制问题
2019/09/01 PHP
JS中简单的实现像C#中using功能(有源码下载)
2007/01/09 Javascript
Z-Blog中用到的js代码
2007/03/15 Javascript
弹出广告特效代码(一个IP只弹出一次)
2007/05/11 Javascript
jquery关于图形报表的运用实现代码
2011/01/06 Javascript
JavaScript 一道字符串分解的题目
2011/08/03 Javascript
判断对象是否Window的实现代码
2012/01/10 Javascript
js对象与打印对象分析比较
2013/04/23 Javascript
JavaScript避免代码的重复执行经验技巧分享
2014/04/17 Javascript
Javascript中的call()方法介绍
2015/03/15 Javascript
jquery+正则实现统一的表单验证
2015/09/20 Javascript
谈一谈javascript闭包
2016/01/28 Javascript
javascript 判断页面访问方式电脑或者移动端
2016/09/19 Javascript
原生js实现轮播图
2017/02/27 Javascript
Angular.js中ng-include用法及多标签页面的实现方式详解
2017/05/07 Javascript
基于JS代码实现简单易用的倒计时 x 天 x 时 x 分 x 秒效果
2017/07/13 Javascript
浅谈angularJS的$watch失效问题的解决方案
2017/08/11 Javascript
javascript判断一个变量是数组还是对象
2019/04/10 Javascript
Vue列表如何实现滚动到指定位置样式改变效果
2020/05/09 Javascript
js实现简易计算器小功能
2020/11/18 Javascript
分析Python编程时利用wxPython来支持多线程的方法
2015/04/07 Python
利用Python中的mock库对Python代码进行模拟测试
2015/04/16 Python
python 字典中取值的两种方法小结
2018/08/02 Python
python opencv如何实现图片绘制
2020/01/19 Python
意大利体育用品和运动服网上商店:Maxi Sport
2019/09/14 全球购物
在校生党员自我评价
2013/09/25 职场文书
公积金转移接收函
2014/01/11 职场文书
安全生产目标责任书
2014/04/14 职场文书
工作作风承诺书
2014/08/30 职场文书
2014迎国庆演讲稿
2014/09/19 职场文书
小学“向国旗敬礼”网上签名寄语活动总结
2014/09/27 职场文书
2014年煤矿工人工作总结
2014/12/08 职场文书
个人学习总结范文
2015/02/15 职场文书
Go gorilla/sessions库安装使用
2022/08/14 Golang