【1】簡介
因為小程序的api描述都比較簡單，並沒有wxml及wxss的描述，一定會想小程序有沒有一個UI庫，類似於前端中的Bootstrap，MD，Semantic UI這樣的框架UI庫。有的，它就是WeUI。
WeUI 是一套同微信原生視覺體驗一致的基礎樣式庫，由微信官方設計團隊為微信內網頁和微信小程序量身設計，令用戶的使用感知更加統一。包含button、cell、dialog、 progress、 toast、article、actionsheet、icon等各式元素。
WeUI是在微信終端非常出色的UI樣式庫，提供了非常多豐富的基礎UI組件，最重要的是擁有了和微信一致的視覺體驗，使得用戶即使從微信切換到相關小程序，也不會覺得UI感到突兀。
它的界面如圖：
【2】下載配置
下載鏈接：https://github.com/Tencent/weui-wxss
- 將整個文件下載下來，將其中的dist文件夾導入到獨立的小程序中作為參考如下圖
注意：樣式文件可直接引用dist/style/weui.wxss，或者單獨引用dist/style/widget下的組件的wxss。
2.將style文件夾拷貝到小程序根目錄中，如下圖。
3.weui.wxss的引入方法
方法一.在app.wxss內或者需要的頁面引入style/weui.wxss。
/**app.wxss**/ @import 'style.weui.wxss'
方式二：在app.wxss內或者需要的頁面引入style/widget下的組件的wxss。
/**app.wxss---->引入button的wxss**/ @import 'style.widget.weui-button.weui-button.wxss';
注意：這樣引入前提是weui.wxss放在全局的位置如圖
這樣就可以簡單的調用WeUI組件了。
【3】微信開發工具預覽
-
使用微信開發者工具打開源代碼工程的dist目錄
打開微信開發者工具，點擊導入項目，選擇
weui-wxss項目目錄下的dist目錄。
接着點擊導入，就可以看到weui的預覽了。
【4】使用
了解了weui的預覽方法，接下來我們就可以使用weui進行一些簡單的開發了，在這里，我們完成一個九宮格的開發。
新建一個空白的小程序工程，選擇新建項目，填寫項目名稱、appId、項目目錄之后，就進入小程序的開發頁面。
新建了小程序工程之后，我們就可以在這個工程上使用weui了。
使用weui進行開發可以簡單分為兩個步驟。
（1）導入weui.wxss文件 （2）參照weui提供的例子使用weui組件
接下來我們按步驟嘗試即可。
.