UI優秀框架（庫）

1.vux

官網：https://doc.vux.li/zh-CN/

Github：https://github.com/airyland/vux

13818  Stars  3064 Forks

 

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

基於webpack + vue-loader + vux能夠快速開發移動端頁面，配合vux-loader方便你在WeUI的基礎上定製須要的樣式。

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

VUX並不徹底依賴於WeUI，VUX 在 WeUI 的基礎上擴展了多個經常使用組件，可是儘可能保持總體UI樣式接近WeUI的設計規範。

總結：vux仍是比較適合當前小程序開發的，組件很是全面，並且使用說明也都很是詳細，而且能夠直接查看源碼，學習起來也比較方便。

 

2.Amaze UI

官網：http://amazeui.org/

Github：https://github.com/amazeui/amazeui

12179  Stars  2496 Forks

• Amaze UI 以移動優先（Mobile first）爲理念，從小屏逐步擴展到大屏，最終實現全部屏幕適配，適應移動互聯潮流。
• Amaze UI 含近 20 個 CSS 組件、20 餘 JS 組件，更有多個包含不一樣主題的 Web 組件，可快速構建界面出色、體驗優秀的跨屏頁面，大幅提高開發效率。
• 相比國外框架，Amaze UI 關注中文排版，根據用戶代理調整字體，實現更好的中文排版效果；兼顧國內主流瀏覽器及 App 內置瀏覽器兼容支持。
• Amaze UI 面向 HTML5 開發，使用 CSS3 來作動畫交互，平滑、高效，更適合移動設備，讓 Web 應用更快速載入。

總結：組件種類較爲豐富，Amaze UI Web和element-UI較爲類似。Amaze UI Touch風格比較賞心悅目，適合React開發的項目。

3.WeUIi

Github：https://github.com/weui/weui

DEMO：https://weui.io/

19854 Stars  5278 Forks

WeUI 是一套同微信原生視覺體驗一致的基礎樣式庫，由微信官方設計團隊爲微信內網頁和微信小程序量身設計，令用戶的使用感知更加統一。

風格更加偏向於原生微信。

4.MUI

官網：http://dev.dcloud.net.cn/mui/

Github：https://github.com/dcloudio/mui

9751 Stars  5137 Forks

官網描述：最接近原生APP體驗的高性能前端框架。

總結：這個框架是以兩大系統爲參照來封裝UI組件，框架自身還有一個較爲活躍的社區，不太好的地方是關於開發應用的流暢度，這頁是 H5 

目前的劣勢，MUI其實仍是須要是藉助 Webview來提高，而不是框架自己。

5.Semantic UI

官網：https://semantic-ui.com/

Github：https://github.com/semantic-org/semantic-ui/

42627 Stars  4584 Forks

Semantic做爲一款開發框架，幫助開發者使用對人類友好的HTML語言構建優雅的響應式佈局。

總結：跟 Bootstrap 沒太多的區別，不過代碼命名規範上卻相差甚大，Semantic的命名全是採用複合的方式，類名特別的離散，用的時候須要當心本身擴展或者新增的 class 命名與它的類名衝突。

風格中規中矩，比較適合傳統行業及B端系統開發

6.UiKit

官網：http://www.getuikit.com/
Github：https://github.com/uikit/uikit

13006 Stars  1976 Forks

樣式中規中矩，組件效果js實現比較清楚，能夠學習借鑑。

7.Pure

官網：http://purecss.io/

Github：https://github.com/yahoo/pure/

18965 Stars  2028 Forks

和bootstrap比較相似，樣式風格較爲單一。

8.Ant Design

官網：https://ant.design/index-cn

Github：https://github.com/ant-design/ant-design/

32705 Stars  10511 Forks

特性#

• 提煉自企業級中後臺產品的交互語言和視覺風格。

• 開箱即用的高質量 React 組件。

• 使用 TypeScript 構建，提供完整的類型定義文件。

• 全鏈路開發和設計工具體系。

支持環境#

• 現代瀏覽器和 IE9 及以上（須要 polyfills）。

• 支持服務端渲染。

• Electron

•  

和Element-ui比較類似，樣式風格比較適合PC端系統。