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 相关文章推荐
[原创]js与自动伸缩图片 自动缩小图片的多浏览器兼容的方法总结
Mar 12 Javascript
jquery easyui的tabs使用时的问题
Mar 23 Javascript
为开发者准备的10款最好的jQuery日历插件
Feb 04 Javascript
动态加载jQuery的方法
Jun 16 Javascript
javascript实现一个数值加法函数
Jun 26 Javascript
JavaScript数组对象赋值用法实例
Aug 04 Javascript
基于jquery实现省市联动效果
Nov 23 Javascript
开源免费天气预报接口API及全国所有地区代码(国家气象局提供)
Dec 26 Javascript
详谈commonjs模块与es6模块的区别
Oct 18 Javascript
基于Express框架使用POST传递Form数据
Aug 10 Javascript
vue中created和mounted的区别浅析
Aug 13 Javascript
jquery css实现流程进度条
Mar 26 jQuery
深入剖析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
截获网站title标签之家内容的例子
2006/10/09 PHP
php函数指定默认值方法的小例子
2013/12/04 PHP
php获取flash尺寸详细数据的方法
2016/11/12 PHP
php中引用&的用法分析【变量引用,函数引用,对象引用】
2016/12/12 PHP
PHP实现获取ip地址的5种方法,以及插入用户登录日志操作示例
2019/02/28 PHP
tp5(thinkPHP5框架)使用DB实现批量删除功能示例
2019/05/28 PHP
php连接sftp的作用以及实例代码
2019/09/23 PHP
js 表格隔行颜色
2009/12/02 Javascript
jQuery 验证插件 Web前端设计模式(asp.net)
2010/10/17 Javascript
javascript确认框的三种使用方法
2013/12/17 Javascript
javascript框架设计读书笔记之种子模块
2014/12/02 Javascript
AngularJS学习笔记之ng-options指令
2015/06/16 Javascript
jquery实现可自动收缩的TAB网页选项卡代码
2015/09/06 Javascript
BootStrap实用代码片段之一
2016/03/22 Javascript
微信小程序 开发之滑块视图容器(swiper)详解及实例代码
2017/02/22 Javascript
js/jq仿window文件夹框选操作插件
2017/03/08 Javascript
jQuery+C#实现参数RSA加密传输功能【附jsencrypt.js下载】
2017/06/26 jQuery
浅谈事件冒泡、事件委托、jQuery元素节点操作、滚轮事件与函数节流
2017/07/22 jQuery
在vue项目中使用sass的配置方法
2018/03/20 Javascript
Vue.js图片预览插件使用详解
2018/08/27 Javascript
vue中英文切换实例代码
2020/01/21 Javascript
js实现鼠标点击飘爱心效果
2020/08/19 Javascript
总结python爬虫抓站的实用技巧
2016/08/09 Python
Python爬虫实现网页信息抓取功能示例【URL与正则模块】
2017/05/18 Python
Python标准库itertools的使用方法
2020/01/17 Python
利用Tensorflow的队列多线程读取数据方式
2020/02/05 Python
爱游人:Travelliker
2017/09/05 全球购物
工厂会计员职责
2014/02/06 职场文书
《再别康桥》教学反思
2014/02/12 职场文书
护士演讲稿优秀范文
2014/04/30 职场文书
新手上路标语
2014/06/20 职场文书
司法局群众路线教育实践活动开展情况总结
2014/10/25 职场文书
大学生党员自我评价
2015/03/04 职场文书
工作简历自我评价
2015/03/11 职场文书
幼儿园园长安全责任书
2015/05/08 职场文书
JS前端可视化canvas动画原理及其推导实现
2022/08/05 Javascript