如何高效開發小程式？推薦一個絕對好用的小程式開源框架

這篇文章推薦你絕對是最好的小程式開源框架，目前小程式很火，不會開發怎麼行？但是開發微信小程式總是很繁瑣又頭痛的一件事，還要查閱各種資料，沒個幾天半月的都弄不出個什麼頭緒，反正我是屬於學習比較慢的那種，有時一個知識點憋半天想不懂怎麼回事，寫這篇文章的目的就是為了給大家一個參考方向，有個選擇吧，希望能幫助到大家。一起學習吧。 apache php mysql

舉些例子哈

---

##1、 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 程式碼轉換編譯成小程式目標程式碼的能力

#2、Tina.js

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

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

3、Taro

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

使用Taro，我們可以只書寫一套程式碼，再透過Taro 的編譯工具，將原始碼分別編譯出可以在不同端（微信小程式、H5、App 端等）運行的程式碼。同時 Taro 也提供開箱即用的語法偵測和自動補全等功能，有效提升了開發體驗和開發效率。

4、wepy

#WePY 是一款讓小程式支援元件化開發的框架，透過預編譯的手段讓開發者可以選擇自己喜歡的開發風格去開發小程式。框架的細節最佳化，Promise，Async Functions 的引進都是為了能讓開發小程式專案變得更簡單，有效率。

特性：

• #類別Vue 開發風格

• #支援自訂元件開發

• #支援引入NPM 套件

• 支援Promise

• #支援ES2015 特性，如Async Functions

• #支援多種編譯器，Less/Sass/Styus、Babel/Typescript、Pug

• 支援多種外掛程式處理，檔案壓縮，圖片壓縮，內容替換等

• 支援Sourcemap，ESLint 等

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

 5、weweb

##是一個相容於小程式語法的前端框架，你可以用小程式的寫法，來寫web 應用。如果你已經有小程式了，透過它你可以將你的小程式運行在瀏覽器中。

特性： 跨平台，一套程式碼多端運作（小程式、h5、未來直接打包成安卓、ios app 也不是夢) 自帶常用元件，完美繼承了小程式內建元件相容小程式rpx 語法，讓頁面更容易適配各種機型元件庫

##還有各種開源的元件庫，例如有以下這幾個：

有讚的

zanui-weapp

和iview 這兩個比較有名。 這兩個元件庫我之前在我的公眾號都推薦過，具體用法和功能我就不多介紹了，自己找我以前的推文或自己搜尋一下就很清楚了。用法很簡單。

重點

上面介紹了5 個開源框架和兩個元件庫，我並不是說上面的不好，上面的絕對都很好，不管上面的幾個開源框架還是元件庫都是大廠產品，都很好。但是他們只是開源框架就是開源框架，而元件庫就是元件庫。一直沒有滿足我單獨針對微信小程式開發的痛點。

小程式開發一個是開源框架的好用，另外一個就是豐富的元件庫，單純官方推出的並不能滿足我們的需要，上面的框架和元件庫都是分開的。所以並不能解決我的痛點。

而今天我推薦的這個開源框架既能提供框架也豐富擴展了很多組件，使我們開發的時候不用擔心再自己封裝組件了

。 其實上面分享的元件庫有一個重大的缺點，他們元件庫夠豐富，但是對於樣式的自訂很死板，不靈活，但是今天的這個就靈活多了。

我推薦給大家的這個開源框架就是：

touchwx

。 Touch WX 是一套完全免費的微信小程式開發框架，包含豐富的 UI 控制項用於官方元件的補充。特點如下：

1、元件擴充：

增加了30 多種常用的元件用於官方元件的補充。

2、功能擴充：

#相容於阿里的iconfont 圖示庫，海量向量圖示隨意使用；補充了常用樣式庫、支援less 語法、支援全域配置主題色等

#3、開發體驗改善：

四文件方式改為單文件方式，透過VSCode 編輯器外掛的方式開發，擁有web 開發體驗；

4、小程式轉為H5 應用：

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

這套框架的原理是：

#將Touch WX 工程中所寫的程式碼進行編譯，直接輸出為微信小程式工程原始程式碼。擴充的 30 多種元件，完全是基於小程式官方的自訂元件機制實作（row&col 除外）。

所以它支援小程式的全部語法，怎麼開發小程序，就怎麼開發 Touch WX。

不過因為是單一檔案的開發方式，在檔案的程式碼結構上稍有不同。請注意這一點。

這樣好處在於：

#1、開發者遷移成本很小。

可以輕鬆的將現有的小程式移植為Touch WX 工程，來使用它的擴展能力；

##2、便於排除錯誤。

當遇到問題時，開發者也可以隨時查看輸出的小程式原始程式碼來定位問題所在。不會搞不清楚到底是框架問題還是自己程式碼的問題；

3、按需編譯

由於小程式對體積有限制，在使用框架開發時，只有使用到的元件才會編譯輸出為小程式原始碼。沒用到的不會輸出。

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

以後不想用了這套框架，可以直接對已經輸出的小程式工程進行維護。

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

最後，大家可以動手做一下。

今天的分享都是我用過才整理給大家的，都很不錯，大家可以轉發讓更多的人知道。

相關文章：

十大開源Android應用程式的開發框架

#微信小程式元件化開發Labrador框架的介紹

相關影片：

微信小程式實戰開發影片教學

以上是如何高效開發小程式？推薦一個絕對好用的小程式開源框架的詳細內容。更多資訊請關注PHP中文網其他相關文章！