作者 全棧弄潮兒

Weex

2016年4月21日，阿里巴巴在Qcon大會上宣布跨平臺移動開發(fā)工具Weex開放內測邀請。

Weex

是一套簡單易用的跨平臺開發(fā)方案，能以 web 的開發(fā)體驗構建高性能、可擴展的 native 應用，為了做到這些，Weex 與 Vue

合作，使用 Vue 作為上層框架，并遵循 W3C 標準實現(xiàn)了統(tǒng)一的 JSEngine 和 DOM API，這樣一來，你甚至可以使用其他框架驅動

Weex，打造三端一致的 native 應用。

Weex能夠完美兼顧性能與動態(tài)性，支持iOS、安卓、YunOS及Web等多端部署。

其工作原理

Weex

表面上是一個客戶端技術，但實際上它串聯(lián)起了從本地開發(fā)環(huán)境到云端部署和分發(fā)的整個鏈路。開發(fā)者首先可以在本地像撰寫 web 頁面一樣撰寫一個

app 的頁面，然后編譯成一段 JavaScript 代碼，形成 Weex 的一個 JS bundle；在云端，開發(fā)者可以把生成的 JS

bundle 部署上去，然后通過網(wǎng)絡請求或預下發(fā)的方式傳遞到用戶的移動應用客戶端；在移動應用客戶端里，WeexSDK 會準備好一個

JavaScript 引擎，并且在用戶打開一個 Weex 頁面時執(zhí)行相應的 JS bundle，并在執(zhí)行過程中產生各種命令發(fā)送到 native

端進行的界面渲染或數(shù)據(jù)存儲、網(wǎng)絡通信、調用設備功能、用戶交互響應等移動應用的場景實踐；同時，如果用戶沒有安裝移動應用，他仍然可以在瀏覽器里打開一個相同的

web 頁面，這個頁面是使用相同的頁面源代碼，通過瀏覽器里的 JavaScript 引擎運行起來的。

Mint UI

基于 Vue.js 的移動端組件庫

Mint UI 包含豐富的 CSS 和 JS 組件，能夠滿足日常的移動端開發(fā)需要。通過它，可以快速構建出風格統(tǒng)一的頁面，提升開發(fā)效率。

真正意義上的按需加載組件?？梢灾患虞d聲明過的組件及其樣式文件，無需再糾結文件體積過大。

考慮到移動端的性能門檻，Mint UI 采用 CSS3 處理各種動效，避免瀏覽器進行不必要的重繪和重排，從而使用戶獲得流暢順滑的體驗。

依托 Vue.js 高效的組件化方案，Mint UI 做到了輕量化。即使全部引入，壓縮后的文件體積也僅有 ~30kb (JS + CSS) gzip。

vue-carbon

基于 vuejs 1.0 開發(fā) material design 風格的移動端 WEB UI 庫

使用文檔地址 https://myronliu347./vue-carbon/book/v0.5.0/index.html

Muse-UI

基于 Vue 2.0 和 Material Desigin 的 UI 組件庫

特性

1.組件豐富

Muse UI 基本實現(xiàn)了 Material Design 設計規(guī)范類的所有組件，另外還開發(fā)許多的功能性的組件

2.可定制

Muse UI 使用less文件，所有的顏色都有一個變量維護，通過編寫 less 文件完成自定義主題，另外組件內部也提供一些修改效果的參數(shù)

3.基于 Vue 2.0

Muse UI 基于 Vue2.0 開發(fā)，Vue2.0是當下最快的前端框架之一，小巧，api友好，可用于開發(fā)的復雜單頁應用

VUWE

vuwe是一款基于微信WeUI所開發(fā)的，專用于Vue2的組件庫。

它與WeUI完全解耦。用戶通過自定義WeUI的樣式文件，可以方便地對VUWE實現(xiàn)定制化。

vue-mobile

vue-mobile is an UI Framework build with Vue.js for SPA:

Full Page Structure - header, content, footer

Page transition support by vue-router

Bunch of Powerful Components, easy to use and extend

high performance CSS3 Animation

1px border for all components - as well as round border

Write with Vue - the most important

vonic

一個基于 vue.js 和 ionic 樣式的 UI 框架，用于快速構建移動端單頁應用。

和 ionic 的關系：沒有關系，只是在樣式方面以 ionic 的 css 文件為基礎（做了一些調整）

vux

Vux（讀音 [v'ju:z]，同views）是基于WeUI和Vue(2.x)開發(fā)的移動端UI組件庫，主要服務于微信頁面。

基于webpack+vue-loader+vux可以快速開發(fā)移動端頁面，配合vux-loader方便你在WeUI的基礎上定制需要的樣式。

vux-loader保證了組件按需使用，因此不用擔心最終打包了整個vux的組件庫代碼。

vux并不完全依賴于WeUI，但是盡量保持整體UI樣式接近WeUI的設計規(guī)范。最初目標是創(chuàng)建一個易用，實用，美觀的移動端UI組件庫，現(xiàn)在離理想狀態(tài)還有不少距離，因此需要大家及時反饋問題及貢獻代碼。

即使你不使用vux的代碼, 但能從源碼得到一些參考那么也是件讓人高興的事情。