微信小程序框架推荐_分享好用的小程序前端开发框架

时间: 2018-06-11阅读: 3459标签: 小程序

选择优秀的框架,能帮助我们节省开发时间,提高代码重用性,让开发变得更简单。下面就整理关于微信小程序的前端框架,推荐给大家,希望对大家的学习开发有所帮助。


MINA  

小程序提供的开发框架为MINA框架,它类似于淘宝Weex、vue框架。MINA框架通过封装微信客户端提供的文件系统、网络通信、任务管理、数据安全等基础功能,对上层提供一整套JavaScript API,让开发者能够非常方便地使用微信客户端提供的各种基础功能与能力,快速构建一个应用。  

地址: https://developers.weixin.qq.com/miniprogram/dev/framework/MINA.html


WePY 

WePY 是一款让小程序支持组件化开发的框架,通过预编译的手段让开发者可以选择自己喜欢的开发风格去开发小程序。框架的细节优化,Promise,Async Functions的引入都是为了能让开发小程序项目变得更加简单,高效。 

安装(更新) wepy 命令行工具

npm install wepy-cli -g

生成开发示例 

wepy new myproject

开发实时编译 

wepy build --watch

地址:

官网:https://tencent.github.io/wepy/
gitHub:https://github.com/Tencent/wepy


mpvue  

mpvue 是美团点评开源的一个使用Vue.js开发小程序的前端框架。框架基于 Vue.js 核心,mpvue 修改了 Vue.js 的  runtime 和  compiler 实现,使其可以运行在小程序环境中,从而为小程序开发引入了整套 Vue.js 开发体验。使用  mpvue 开发小程序,你将在小程序技术体系的基础上获取到这样一些能力: 

  • 彻底的组件化开发能力:提高代码复用性
  • 完整的 Vue.js 开发体验
  • 方便的 Vuex 数据管理方案:方便构建复杂应用
  • 快捷的 webpack 构建机制:自定义构建策略、开发阶段 hotReload
  • 支持使用 npm 外部依赖
  • 使用 Vue.js 命令行工具 vue-cli 快速初始化项目
  • H5 代码转换编译成小程序目标代码的能力

地址:  

官网: http://mpvue.com/  
Github: https://github.com/Meituan-Dianping/mpvue


tina

一款轻巧的渐进式微信小程序框架,特性: 

轻盈小巧。 极易上手,保留 MINA (微信小程序官方框架) 的大部分 API 设计;无论你有无小程序开发经验,都可以轻松过渡上手。 渐进增强,既有状态管理器,也有路由增强,还可以自己编写插件。

地址:  

官网:https://tina.js.org
gitHub:https://github.com/tinajs/tina 


weweb

一个兼容小程序语法的前端框架,你可以用小程序的写法,来写web应用。如果你已经有小程序了,通过它你可以将你的小程序运行在浏览器中。

特性: 跨平台,一套代码多端运行(小程序、h5、未来直接打包成安卓、ios app也不是梦) 自带常用组件,完美继承了小程序内置组件 兼容小程序rpx语法,使页面更容易适配各种机型

地址: https://github.com/wdfe/weweb


Labrador

微信小程序组件化开发框架 ,其特点:

  • 使用Labrador框架可以使微信开发者工具支持加载海量NPM包
  • 支持ES6/7标准代码,使用async/await能够有效避免回调地狱
  • 组件重用,对微信小程序框架进行了二次封装,实现了组件重用和嵌套
  • 可集成Redux,使用Redux数据流控制,让项目逻辑清晰可维护
  • 自动持久化数据,支持redux-persist自动将运行数据保存
  • 自动化测试,非常容易编写单元测试脚本,不经任何额外配置即可自动化测试
  • Flow.js强类型检查,编写更加安全稳定的代码
  • 使用Editor Config及ESLint标准化代码风格,方便团队协作
  • 强力压缩代码,尽可能减小程序体积,让你在1M的限制内做更多的事

首先系统中需要nodejs和npm,然后全局安装Labrador-cli 

npm install -g labrador-cli

初始化项目 

labrador create demo //新建一个项目 
cd demo //进入demo

地址:

 gitHub:https://github.com/maichong/labrador

 


站长推荐

1.云服务推荐: 国内主流云服务商,各类云产品的最新活动,优惠券领取。地址:阿里云腾讯云华为云

链接: http://www.fly63.com/article/detial/870

微信小程序picker组件两列关联使用方式

在使用微信小程序picker组件时候,可以设置属性 mode = multiSelector 意为多列选择,关联选择,当第一列发生改变时侯,第二列甚至第三列发生相应的改变

小程序自定义tabbar占位问题

针对于小程序中自定义tabbar问题,有多种自定义方式。其中之一就是需要将原先系统自带的tabbar隐藏,调用,就是在小程序底部原先放置tabbar的内容会出现空白,仍然会出现占位问题。

小程序插件怎么玩?有赞和千万级用户的“群里有事”做了一次示范

小程序插件让大的公司赋能外部开发者变得非常方便,极大降低了中小开发者开发丰富的小程序应用的门槛,未来的发展是很值得期待的。尤其是国庆节前夕,微信公布的关于小程序跳小程序的新政策,极大地限制了不同主体之间小程序互跳的自由度

使用CryptoJS在小程序中实现加解密

本文使用md5和rc4作为示例代码,可以根据实际项目选择不同的加密方式:在百度静态资源公共库中搜索crypto-js、用到CryptoJS的js放到同一个文件中,并在文件最下方暴露接口module.exports = CryptoJS

小程序web-view关闭后,页面音频没有关闭

在web-view的src中,引入了一个HTML5页面,这个页面有个自动播放的音频。在小程序中,点击右上角关闭小程序后,web-view页面中的音频依然会播放。

小程序图片加载失败使用默认图片

小程序的image标签有几个常用的属性,lazy-load(懒加载,默认为fasle,不过和本文无关),bindload(当图片加载完成的时候触发的事件),另一个就是我们本文的主角binderror(当发生错误的时候触发的事件);

微信小程序连接蓝牙硬件的实现

项目需要使用小程序的蓝牙功能与硬件设备进行连接相互传送数据指令 ,整个流程就这样,因为开启了onBLECharacteristicValueChange,所以你在写入数据(writeBLECharacteristicValue)的时候,设备应答的数据就被监测到了

小程序--人脸识别功能(百度ai)

接入流程:1. 按照文档获取AppID、API Key、Secret Key,进行Access Token(用户身份验证和授权的凭证)的生成,2. 选择人脸识别-->人脸检测,人脸识别接口分为V2和V3两个版本,确认在百度云后台获得的是V2还是v3版本接口权限。

微信小程序视图层处理增强之WXS

WXS算是专供WXML调用的有独立作用域的JS模块(不是全功能的JS,感觉有所限制)。举个例子,在这之前,我们是没有办法在WXML的数据绑定括号{{}}中调用JS函数的,所以在WXML层面就缺少了进一步做数据处理的能力。

微信小程序常用的几个UI组件库

WeUI 是一套同微信原生视觉体验一致的基础样式库,由微信官方设计团队为微信 Web 开发量身设计,可以令用户的使用感知更加统一。包含button、cell、dialog、 progress、 toast、article、actionsheet、icon等各式元素。

点击更多...

内容以共享、参考、研究为目的,不存在任何商业目的。其版权属原作者所有,如有侵权或违规,请与小编联系!情况属实本人将予以删除!