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 相关文章推荐
Ajax,UTF-8还是GB2312 eval 还是execScript
Nov 13 Javascript
javascript 嵌套的函数(作用域链)
Mar 15 Javascript
判断字符串的长度(优化版)中文占两个字符
Oct 30 Javascript
JavaScript 冒泡排序和选择排序的实现代码
Sep 03 Javascript
React实现点击删除列表中对应项
Jan 10 Javascript
JS 仿支付宝input文本输入框放大组件的实例
Nov 14 Javascript
Vue.js中对css的操作(修改)具体方式详解
Oct 30 Javascript
JS使用百度地图API自动获取地址和经纬度操作示例
Apr 16 Javascript
MockJs结合json-server模拟后台数据
Aug 26 Javascript
p5.js码绘“跳动的小正方形”的实现代码
Oct 22 Javascript
微信小程序自定义弹出层效果
May 26 Javascript
Vue初始化中的选项合并之initInternalComponent详解
Jun 11 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
了解咖啡雨林联盟认证 什么是雨林认证 雨林认证是什么意思
2021/03/05 新手入门
火车头采集器3.0采集图文教程
2007/03/17 PHP
thinkphp获取栏目和文章当前位置的方法
2014/10/29 PHP
动态加载js的几种方法
2006/10/23 Javascript
this和执行上下文实现代码
2010/07/01 Javascript
jquery中通过过滤器获取表单元素的实现代码
2011/07/05 Javascript
extjs 如何给column 加上提示
2014/07/29 Javascript
angular route中使用resolve在uglify压缩后问题解决
2016/09/21 Javascript
JS生成和下载二维码的代码
2016/12/07 Javascript
VUE使用vuex解决模块间传值问题的方法
2017/06/01 Javascript
详解vue模拟加载更多功能(数据追加)
2017/06/23 Javascript
NodeJs通过async/await处理异步的方法
2017/10/09 NodeJs
基于JavaScript实现表格滚动分页
2017/11/22 Javascript
OkHttp踩坑随笔为何 response.body().string() 只能调用一次
2018/01/08 Javascript
node.js中TCP Socket多进程间的消息推送示例详解
2018/07/10 Javascript
JS实现换肤功能的方法实例详解
2019/01/30 Javascript
vue中的过滤器实例代码详解
2019/06/06 Javascript
javascript实现鼠标点击生成文字特效
2019/12/24 Javascript
[03:26]回顾2015国际邀请赛中国区预选赛
2015/06/09 DOTA
[02:02]特效爆炸!DOTA2珍宝之瓶待你开启
2018/08/21 DOTA
Python实现简单拆分PDF文件的方法
2015/07/30 Python
python、java等哪一门编程语言适合人工智能?
2017/11/13 Python
python 消除 futureWarning问题的解决
2019/12/25 Python
详解python 内存优化
2020/08/17 Python
在终端启动Python时报错的解决方案
2020/11/20 Python
Python基于opencv的简单图像轮廓形状识别(全网最简单最少代码)
2021/01/28 Python
Fossil美国官网:化石手表、手袋、首饰及配饰
2019/02/17 全球购物
Strathberry苏贝瑞中国官网:西班牙高级工匠手工打造
2020/10/19 全球购物
街道务虚会发言材料
2014/10/20 职场文书
2014年老干部工作总结
2014/11/21 职场文书
市场总监岗位职责
2015/02/11 职场文书
可可西里观后感
2015/06/08 职场文书
教师信息技术学习心得体会
2016/01/21 职场文书
七年级话题作文之执着
2019/11/19 职场文书
Python中字符串对象语法分享
2022/02/24 Python
win7配置本地ftp服务器的图文教程
2022/08/05 Servers