WeUI是一套同微信原生視覺體驗一致的基礎(chǔ)樣式庫，由微信官方設(shè)計團隊為微信 Web 開發(fā)量身設(shè)計，可以令用戶的使用感知更加統(tǒng)一。包含button、cell、dialog、 progress、 toast、article、actionsheet、icon等各式元素。

預(yù)覽及說明

預(yù)覽地址：http://weui.github.io/weui/

詳細說明：從微信WeUI設(shè)計規(guī)范，解讀移動界面設(shè)計

視覺標準

WeUI-Sketch

下載及使用

1、微信關(guān)注“起點學(xué)院”服務(wù)號（掃描二維碼立即關(guān)注）；

2、回復(fù)關(guān)鍵詞“微信設(shè)計規(guī)范”至【起點學(xué)院】服務(wù)號后臺即可獲取下載地址。

下載后，只需要在頁面中引入dist/style/weui.css或者dist/style/weui.min.css其中之一即可。 例如:

開發(fā)

git clone https://github.com/weui/weui.git

cd weui

npm install -g gulp

npm install

npm start

運行npm start命令，會監(jiān)聽src目錄下所有文件的變更，并且默認會在8080端口啟動服務(wù)器，然后在瀏覽器打開http://localhost:8080/example。

第三方擴展

• lihongxun945/jquery-weui
• kevyu/weui-sass
• Eric-Guo/weui-rails(Using kevyu/weui-sass)
• n7best/react-weui
• aidenzou/vue-weui
• adcentury/vue-weui
• ZTfer/weui-sketch
• i5ting/weui-practice
• airyland/vux

文檔

WeUI 說明文檔參考 Wiki

License

The MIT License(http://opensource.org/licenses/MIT) 請自由地享受和參與開源

原文地址：https://github.com/weui/weui