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 相关文章推荐
top.location.href 没有权限 解决方法
Aug 05 Javascript
javascript 词法作用域和闭包分析说明
Aug 12 Javascript
如何让div span等元素能响应键盘事件操作指南
Nov 13 Javascript
window.onresize 多次触发的解决方法
Nov 08 Javascript
举例详解JavaScript中Promise的使用
Jun 24 Javascript
jquery SweetAlert插件实现响应式提示框
Aug 18 Javascript
轻松掌握jQuery中wrap()与unwrap()函数的用法
May 24 Javascript
浅谈ES6新增的数组方法和对象
Aug 08 Javascript
深入浅析AngularJs模版与v-bind
Jul 06 Javascript
Node.js fs模块(文件模块)创建、删除目录(文件)读取写入文件流的方法
Sep 03 Javascript
three.js 制作动态二维码的示例代码
Jul 31 Javascript
JS运算符优先级与表达式示例详解
Sep 04 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模板使用方法示例详解
2014/07/08 PHP
Yii2.0 Basic代码中路由链接被转义的处理方法
2016/09/21 PHP
Javascript中Eval函数的使用
2010/03/23 Javascript
jQuery Select(单选) 模拟插件 V1.3.62 改进版
2010/07/17 Javascript
date.parse在IE和FF中的区别
2010/07/29 Javascript
IE6弹出“已终止操作”的解决办法
2010/11/27 Javascript
jquery命令汇总,方便使用jquery的朋友
2012/06/26 Javascript
JS跨域代码片段
2012/08/30 Javascript
JavaScript伸缩的菜单简单示例
2013/12/03 Javascript
jquery对元素拖动排序示例
2014/01/16 Javascript
JQuery选择器、过滤器大整理
2015/05/26 Javascript
常用jQuery代码分享
2015/07/14 Javascript
微信小程序  简单实例(阅读器)的实例开发
2016/09/29 Javascript
JavaScript对象封装的简单实现方法(3种方法)
2017/01/03 Javascript
JavaScript中Math对象的方法介绍
2017/01/05 Javascript
使用electron实现百度网盘悬浮窗口功能的示例代码
2018/10/24 Javascript
ES6使用 Array.includes 处理多重条件用法实例分析
2020/03/02 Javascript
JS删除数组指定值常用方法详解
2020/06/04 Javascript
vue3.0生命周期的示例代码
2020/09/24 Javascript
vue 插槽简介及使用示例
2020/11/19 Vue.js
[44:15]国士无双DOTA2 6.82版本详解(上)
2014/09/28 DOTA
Python中类的创建和实例化操作示例
2019/02/27 Python
在python下使用tensorflow判断是否存在文件夹的实例
2019/06/10 Python
Kali Linux安装ipython2 和 ipython3的方法
2019/07/11 Python
浅谈Python 敏感词过滤的实现
2019/08/15 Python
Python 仅获取响应头, 不获取实体的实例
2019/08/21 Python
python3文件复制、延迟文件复制任务的实现方法
2019/09/02 Python
python正则表达式匹配IP代码实例
2019/12/28 Python
Python实现区域填充的示例代码
2021/02/03 Python
CSS3 box-sizing属性详解
2016/11/15 HTML / CSS
BONIA官方网站:国际奢侈品牌和皮革专家
2016/11/27 全球购物
小学后勤管理制度
2014/01/14 职场文书
统计工作个人总结
2015/03/03 职场文书
农民工工资承诺书大全
2015/05/04 职场文书
离婚律师函范本
2015/05/27 职场文书
会议承办单位欢迎词
2019/07/09 职场文书