小程序開源框架

下面給你們介紹小程序7個開源框架,你們更具本身喜歡選擇, 7個都很好,各有各的優點(mpvue, Tina.js, Taro, wepy, weweb, touchwx, uni-app)

一、 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 代碼轉換編譯成小程序目標代碼的能力

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

官網：http://mpvue.com/

二、Tina.js

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

特性： 輕盈小巧。 極易上手，保留 MINA (微信小程序官方框架) 的大部分 API 設計；不管你有無小程序開發經驗，均可以輕鬆過渡上手。 漸進加強，既有狀態管理器，也有路由加強，還能夠本身編寫插件。

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

三、Taro

Taro 是由京東 - 凹凸實驗室打造的一套遵循 React 語法規範的多端統一開發框架。我要沒記錯的話，是最近剛剛開源的。

使用 Taro，咱們能夠只書寫一套代碼，再經過 Taro 的編譯工具，將源代碼分別編譯出能夠在不一樣端（微信小程序、H五、App 端等）運行的代碼。同時 Taro 還提供開箱即用的語法檢測和自動補全等功能，有效地提高了開發體驗和開發效率。

官網：http://taro.aotu.io/

GitHub: http://github.com/nervjs/taro

四、wepy

WePY 是一款讓小程序支持組件化開發的框架，經過預編譯的手段讓開發者能夠選擇本身喜歡的開發風格去開發小程序。框架的細節優化，Promise，Async Functions 的引入都是爲了能讓開發小程序項目變得更加簡單，高效。

特性：

類 Vue 開發風格

支持自定義組件開發

支持引入 NPM 包

支持 Promise

支持 ES2015 + 特性，如 Async Functions

支持多種編譯器，Less/Sass/Styus、Babel/Typescript、Pug

支持多種插件處理，文件壓縮，圖片壓縮，內容替換等

支持 Sourcemap，ESLint 等

小程序細節優化，如請求列隊，事件優化等

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

官網：https://tencent.github.io/wepy

 五、weweb

weweb 是一個兼容小程序語法的前端框架，你能夠用小程序的寫法，來寫 web 應用。若是你已經有小程序了，經過它你能夠將你的小程序運行在瀏覽器中。

特性： 跨平臺，一套代碼多端運行（小程序、h五、將來直接打包成安卓、ios app 也不是夢) 自帶經常使用組件，完美繼承了小程序內置組件 兼容小程序 rpx 語法，使頁面更容易適配各類機型

GitHub：https://github.com/wdfe/weweb

組件庫
還有各類開源的組件庫，好比有如下這幾個：

有讚的 zanui-weapp 和 iview 這兩個比較出名。

這兩個組件庫我以前在個人公衆號都推薦過，具體用法和功能我就很少介紹了，本身找我之前的推文或者本身搜索一下就很清楚了。用法很簡單。

原文：https://blog.csdn.net/OQjya206rsQ71/article/details/81213237

6.我推薦這個：touchwx

Touch WX 是一套徹底免費的微信小程序開發框架，包含豐富的 UI 控件用於官方組件的補充。特色以下：

一、組件擴充：

增長了 30 多種經常使用的組件用於官方組件的補充。

二、功能擴充：

兼容阿里的 iconfont 圖標庫，海量矢量圖標隨意使用；補充了經常使用樣式庫、支持 less 語法、支持全局配置主題色等

三、開發體驗改善：

四文件方式改成單文件方式，經過 VSCode 編輯器 + 插件的方式開發，擁有 web 開發體驗；

四、小程序轉爲 H5 應用：

能夠與 H5 開發框架 Touch UI 工程相互轉換，發佈成 webApp。開發一套代碼，擁有兩套應用。

這套框架的原理是：

將 Touch WX 工程中所寫的代碼進行編譯，直接輸出爲微信小程序工程原始代碼。擴充的 30 多種組件，徹底是基於小程序官方的自定義組件機制實現（row&col 除外）。

因此它支持小程序的所有語法，怎麼開發小程序，就怎麼開發 Touch WX。

不過由於是單文件的開發方式，在文件的代碼結構上稍有不一樣。請注意這一點。

這樣好處在於：

一、開發者遷移成本很小。

能夠輕鬆的將已有的小程序移植爲 Touch WX 工程，來使用它的擴展能力；

二、便於排查錯誤。

當遇到問題時，開發者也能夠隨時查看輸出的小程序原始代碼來定位問題所在。不會搞不清楚究竟是框架問題仍是本身代碼的問題；

三、按需編譯

因爲小程序對體積有限制，在使用框架開發時，只有使用到的組件纔會編譯輸出爲小程序源碼。沒用到的不會輸出。

四、不會對框架產生依賴。

之後不想用了這套框架，能夠直接對已經輸出的小程序工程進行維護。

目前我認爲單獨針對小程序開發的話，這個開源框架是最適合咱們的，效率也是最高的。

GitHub：https://github.com/uileader/touchwx

官網：https://www.wetouch.net/wx.html

掃描二維碼體驗   touchwx:

 

 

參考文獻連接:http://www.javashuo.com/article/p-yxdvarfx-hu.html

peace & love

7.uni-app  (也很推薦)

uni-app 是一個使用 Vue.js 開發跨平臺應用的前端框架，開發者編寫一套代碼，可編譯到iOS、Android、H五、小程序等多個平臺。

官網連接:https://uniapp.dcloud.io/

掃碼體驗: