码code-9款小程序开源框架和组件库值得收藏

jiezi

5 年前

作为一名小程序开发者，面对复杂的代码和运行逻辑，也有更多的需求：

想要一套代码直接跑多端！
想要直接套用框架实现开发！
想要在小程序内拥有微信同款 UI！

那就不妨试试小程序开源框架和组件库，开发小程序项目也能变得更加简单，高效。

今天我们收集了些实用的开发框架、组件库以及腾讯官方插件，大家可以了解一下。

WePy 是一款让小程序支持组件化开发的框架，通过预编译的手段让开发者可以选择自己喜欢的开发风格去开发小程序。

特点：相对应的组件库、工具库丰富，也是应用广泛的开发框架。注意一点，由于运行机制的问题，WePy 在使用原生小程序组件 / 库时需要对文档 /demo 里的源码进行调整。

出品方：微信

案例：腾讯翻译君腾讯地图 +

Github：https://github.com/Tencent/wepy

Taro 是一套遵循 React 语法规范的多端开发解决方案，用户可以通过 Taro 的编译工具，将源代码分别编译出可以在不同端运行的代码。

特点：支持包括 H5、移动端以及包括微信等 4 种小程序端，并且有官方维护的跨端 UI 库和工具库，满足开发者的需求。

出品方：京东

案例：京东购物程序员英语

Github：https://github.com/NervJS/taro

mpvue 是一个使用 Vue.js 开发小程序的前端框架。框架基于 Vue.js 核心，mpvue 修改了 Vue.js 的 runtime 和 compiler 实现，使其可以运行在小程序环境中，从而为小程序开发引入了整套 Vue.js 开发体验。

特点：支持 vue 页转化为包括微信等 4 种小程序，熟悉 Vue.js 基本语法的开发者便可以简易上手小程序开发，不过目前没有官方的 UI 组件库。

出品方：美团

案例：美团外卖享物说

Github：https://github.com/Meituan-Di…

Omi 框架是微信支付线研发部研发的下一代前端框架，基于 Web Components 规范设计的组件化框架，可以开发 PC Web、移动端 H5，也可以直接使用 Omi 开发小程序。

特点：打通小程序端和 web 端，在小程序也能实现 web 页面。除了一些平台特有的 API，代码几乎不用改动，就能跑在安卓 /IOS 的小程序里。

出品方：微信

案例：markdown 内容发布系统

Github：https://github.com/Tencent/omi

WeUI 是一套同微信原生视觉体验一致的基础样式库，由微信官方设计团队为微信内网页和微信小程序量身设计，令用户的使用感知更加统一。

适用场景：简洁风格的小程序

出品方：微信

案例：微信指数

GitHub：https://github.com/Tencent/weui

Vant Weapp 是有赞移动端组件库 Vant 的小程序版本，两者基于相同的视觉规范，提供一致的 API 接口，助力开发者快速搭建小程序应用。

适用场景：电商、餐饮、外卖平台、票务预订等购物类小程序

出品方：有赞

案例：有赞精选

GitHub：https://github.com/youzan/van…

小程序插件是可以被开发者添加到小程序内直接使用并为用户提供具体服务的功能组件。

我们也曾经整理过官方插件的内容，可以在微信极客 WeGeek 公众号下方点击菜单【极客干货—小程序插件】获取。

腾讯地图 ——为开发者提供简单的路线方案规划服务

腾讯视频 ——在小程序内搭建视频播放功能

微信同声传译 ——实现语音转文字、文本翻译、语音合成接口等功能

好用的小程序开源项目不止这些，和同好们一起来探讨小程序的开发吧~

我们建了个交流群，欢迎到公众号回复关键词【进群】获取进群方式。