微信小程式常見的UI框架/元件庫總結

想要開發出一套高質量的小程式，運用框架，元件庫是省時省力省心必不可少一部分，隨著小程式日漸火爆，各種不同型別的小程式也漸漸更新，其中不乏一些優秀好用的框架/元件庫。

1：WeUI 小程式–使用教程

https://weui.io/

官方介紹：WeUI 是一套同微信原生視覺體驗一致的基礎樣式庫，由微信官方設計團隊為微信內網頁和微信小程式量身設計，令使用者的使用感知更加統一。小程式開發中最常用到的一款框架，受廣大開發人員的歡迎。

2：美團小程式框架mpvue

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

官方介紹：mpvue是一個使用 Vue.js開發小程式的前端框架。框架基於 Vue.js核心，mpvue修改了 Vue.js的 runtime和 compiler實現，使其可以執行在小程式環境中，從而為小程式開發引入了整套Vue.js開發體驗。

3：元件化開發框架wepy

Github地址:
https://github.com/Tencent/wepy
官網地址：
https://tencent.github.io/wepy

官方介紹：元件化開發，完美解決元件隔離，元件巢狀，元件通訊等問題,支援使用第三方 npm 資源，自動處理 npm 資源之間的依賴關係，完美相容所有無平臺依賴的 npm 資源包.

4：官方框架MINA

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

官方介紹：框架提供了自己的檢視層描述語言 WXML 和 WXSS，以及基於 JavaScript 的邏輯層框架，並在檢視層與邏輯層間提供了資料傳輸和事件系統，可以讓開發者可以方便的聚焦於資料與邏輯上。

5：Tina.js 一款輕巧的漸進式微信小程式框架

Tina.js 開源框架地址： https://github.com/tinajs/tina

官方介紹：是一款輕巧的漸進式微信小程式框架，保留 MINA (微信小程式官方框架) 的大部分 API 設計；無論你有無小程式開發經驗，都可以輕鬆過渡上手。

6：前端框架weweb

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

官方介紹：weweb是一個相容小程式語法的前端框架，你可以用小程式的寫法，來寫web應用。如果你已經有小程式了，通過它你可以將你的小程式執行在瀏覽器中。

7：微信UI元件庫 iView Weapp

https://weapp.iviewui.com/

介紹：iView Weapp 提供了與 iView 一致的 UI 和儘可能相同的介面名稱，大幅度降低了學習成本，是一套一套高質量的微信小程式 UI 元件庫。

8：ZanUI-WeApp -- 一個顏值高、好用、易擴充套件的微信小程式 UI 庫

https://cnodejs.org/topic/589d625a5c8036f7019e7a4a

官方介紹：ZanUI-WeApp結合了微信的視覺規範，為使用者提供更加統一的使用感受。 包含 badge、btn、等共計 17 類元件或元素。

原文作者：祈澈姑娘
技術部落格：https://www.jianshu.com/u/05f416aefbe1

90後前端妹子，愛程式設計，愛運營，愛折騰。
堅持總結工作中遇到的技術問題，堅持記錄工作中所所思所見，歡迎大家加入群聊，一起探討交流。