爲了工作，也爲了長點見識，費心費力搗騰了一個組件庫antd-doddle，還是有成長的，總結都寫了兩篇，收穫還是有的，如果你喜歡聽故事：
爲什麼要雞腿
組件庫寫出來了，項目也陸陸續續用了，但組裏小夥伴用起來，總是要問這個配置怎麼寫，這個組件怎麼用，手把手教學，總不能讓小夥伴都去看源碼實現吧，所以自己一發狠，用一整晚，寫了一篇組件庫使用指南，基本就是下圖這個風格，示例代碼有了，輸入輸出配置有了，輸出效果有了，臨時解決了一些問題，但隨着業務膨脹，使用人員逐步增多，這種靜態文檔已經不能滿足需求了。
雞腿是要解決什麼
不是解決解餓，是讓生活更富有。這一篇組件庫使用指南,該有的內容都有，但問題還是很多：
- 整個組件庫就一個指南，特別長，沒有很好的分類，無法快速找到自己的所需；
- 由於篇幅和實現難度，組件庫demo太單一，覆蓋面太小；
- 組件庫沒有用例，每一次修改，沒有demo用例來快速測試，發佈了才測試，有比較大的風險，容易造成頻繁發版；
- 自己又想搗騰了；
雞腿原配方
市面上有很多成熟的方案，推薦比較多的就是Docz，但試了一下，使用起來並沒有介紹的那麼好用，規範太死板，複雜demo編寫實現困難，所以最後還是採用了antd的組件庫方案Bisheng，畢竟是完美兼容react，與antd的組件庫。
花了一兩天折騰了一下Bisheng，發現其還是很好用的，庫更多是作爲一個路由適配的數據流容器(RenderProps)，可配置性很高，UI完全由使用人自己定製（官方稱其爲主題），庫本身提供一個簡易的主題Bisheng-Theme-One。
只要搞懂了數據長什麼樣，編寫一個展示性組件就顯得不是那麼難了，從下圖看看（圖片路由：http://localhost:8090/guide/introduce）：
- data：是所有的文檔信息，和你的文檔結構具有強匹配，可以用此數據做文檔菜單的數據源；
- pageData：是當前路由，匹配出的文檔內容，也就是你正文要顯示的內容；
- themeConfig：是一個主題定製對象，你想自己定義的變量，都可以在這個對象中增加
- utils：toReactComponent是暴露出來的一個常用方法
當然，每一個主題有一個組件路由適配方案，需要在主題根目錄下的index.js進行配置，一張圖勝所有：
左邊的配置會告訴bisheng插件，在匹配到某個路由時去調用相應的組件。組件的具體實現，請參看源碼，這裏不再一一分析。
雞腿的味道
總的來說，雞腿的味道還是很香的，菜單清晰，組件文檔一目瞭然，還配有相應的demo，上兩張高清大圖感受一下。 
搗騰到此爲止，明天開始專心複習【捂臉】。