MPVUE多环境定义后台URL
小程序选定了mpvue作为开发框架,搭建开发环境和构建环境。自从用了Travis和Jenkins之后,再也回不到手工构建的时代了。
目的-自动构建
web项目中,自从前后台分离的结构形成,就形成了一个要求,前后台的连接URL需要根据部署环境进行切换,线上的URL和测试的URL肯定不同;这点类似于java应用连接数据库的连接切换。
后台URL的定义要能够多环境构建是自动构建的目标。
构建简介
mpvue的框架基于vue.js构建,利用webpack的扩展工具将vue源码转换为小程序的源码。vue的源码是基于node构建的,理论将node构建生态的env模式也能带入mpvue构建过程。
process.env是nodejs提供的官方api。官方定义是:process.env属性返回一个包含用户环境信息的对象。
process.env
process.env.NODE_ENV是默认的全局定义的全局变量.process.env是一个定义对象,可以自定义扩展。
比如:
``` javascript
process.env = {
NODE_ENV : 'dev',
api : 'http://example.com'
}
```
这样子就实现了自定义的过程,将定义分别放到env.dev.js,env.prod.js,env.test.js即可实现多环境实践。
mpvue中使用
mpvue的quickStart提供的构建脚手架,env的定义在config目录中,通过prod.env.js和dev.env.js实现对env的定义。
``` js prod.env.js
module.exports = {
NODE_ENV: '"production"',
api: '"example.com"'
}
```
如何使用呢?
因为process是一个node的全局变量,使用Process对象在vue源码中应该是任意使用的。测试下:
// App.vue
<script>
export default {
created () {
// 调用API从本地缓存中获取数据
const logs = wx.getStorageSync('logs') || []
logs.unshift(Date.now())
wx.setStorageSync('logs', logs)
console.log('app created and cache logs by setStorageSync')
}
}
</script>
//pages/index/index.vue
<script>
export default {
methods: {
clickHandle (msg, ev) {
console.log(process.env)
console.log('clickHandle:', msg, ev)
}
}
}
</script>
启动构建工具,打开微信开发工具,可以正确输出定义结果,目标达成。
MPVUE多环境定义后台URL的更多相关文章
- C语言定义从URL中获取键值的接口
环境:centos7下,对客户端http请求进行解析,来获取有效键值(包括汉字). 头文件 /* 这是一份关于从Http请求信息中提取键值的接口声明的头文件 */ #ifndef _HEAD_H_ # ...
- Django - 环境搭建、url、视图、模板、标签、过滤器
(一).简介 简介就不多说了,网上的内容一大堆.总结来说,django是走大而全的路线,写项目超级快,几乎什么都为你考虑到了,你就乖乖照着它的格式来写就行了. 这里来一些基本认知: web应用框架(w ...
- CI在nginx环境下去掉url中的index.php
在nginx环境下CI框架默认URL规则访问不了,出现500错误,如: http://blog.php230.com/index.php/keywords 今天在服务器配置CI框架环境时,去除URL中 ...
- iOS开发-自己定义后台显示图片(iOS7-Background Fetch的应用)
之前在用电池医生的时候, 发现它有这样一个功能:当应用进入后台的时候, 会显示另外一张图片覆盖App Switcher显示的界面. 效果例如以下: 变成----> 而这种一个功能, 对于保护用户 ...
- XMAL定义后台数据
头部调用程序集xmlns:sys="clr-namespace:System;assembly=mscorlib" <Window.Resources><!--定 ...
- django 定义文章url
url(r'^firstcontent/'+str(date)+'/(?P<first_body_id>\d+)/$', views.firstcontent, name='firstco ...
- djago 定义后台地址
在app 中urls.py 可替换原始后台登陆地址 /admin 为自定义地址
- dede5.7 GBK 在php5.4环境下 后台编辑器无法显示文章内容
问题的原因是:是htmlspecialchars,PHP 5.4后GBK编码下默认不支持中文,转换后内容为空,UTF-8编码没有任何问题. 解决方法如下: 在\include\ckeditor\c ...
- URLSearchParams 接口定义处理 URL 参数串
基本使用方法如下 /* * URLSearchParams属性 * @语法:new URLSearchParams(parameter); */ (function(){ var str = &quo ...
随机推荐
- JAVA 泛型通配符 ? EXTENDS SUPER 的用法
1. <? extends Hero> ArrayList heroList<? extends Hero> 表示这是一个Hero泛型或者其子类泛型heroList 的泛型可能 ...
- 基于PHP的cURL快速入门教程 (小偷采集程序)
cURL 是一个利用URL语法规定来传输文件和数据的工具,支持很多协议,如HTTP.FTP.TELNET等.很多小偷程序都是使用这个函数. 最爽的是,PHP也支持 cURL 库.本文将介绍 c ...
- the django travel(two)分页
一:django路由系统: 注意:我们在urls.py中 定义url的时候,可以加$和不加$,区别的是:加$正则匹配的时候,比如:'/index/$'只能匹配'/index/'这样的url 不能匹配' ...
- 拼多多java后台笔试题目总结(20180830)
1.回合攻击问题 package com.hone.pdd; import java.util.Scanner; /** * 题目:模拟一个游戏场景,两种伤害,一种正常伤害,一种是先蓄力(也算一个回合 ...
- 手动增加swap分区
第一步:创建一个大小为6G的文件:#dd if=/dev/zero of=/swapfile bs=1G count=6第二步:把这个文件变成swap文件:#mkswap /swapfile第三步:启 ...
- java框架复习 简单介绍 (转载)
一.SpringMVC http://blog.csdn.net/evankaka/article/details/45501811 Spring Web MVC是一种基于Java的实现了Web MV ...
- Apache Shiro(一)-登录认证和权限管理初识
What is Apache Shiro? Apache Shiro是一个功能强大.灵活的,开源的安全框架.它可以干净利落地处理身份验证.授权.企业会话管理和加密. Apache Shiro的首要目标 ...
- flink 常见问题整理
1. xml-apis 冲突问题 javax.xml.parsers.FactoryConfigurationError: Provider for class javax.xml.parsers.D ...
- python字典键值对转化为相应的变量名和变量值
将python字典键值对转化为相应的变量名和变量值可以使用以下方法: globals().update({"name":"value"}) locals().u ...
- 20155236 2016-2017-2 《Java程序设计》第九周学习总结
20155236 2016-2017-2 <Java程序设计>第九周学习总结 教材学习内容总结 JDBC入门 1.JDBC简介 JDBC是用于执行SQL的解决方案,开发人员使用JDBC的标 ...