前言
公司項目需要開發一套 UI 組件庫,提供給其他項目組使用,技術棧是 React,因此選用了 alibaba 的 father,它已經幫我做了目錄規范、文件規范、打包配置、配套文檔、UI組件測試等一系列工作,並提供了一個簡單 UI 組件庫示例,供使用者參考。
father,前身的是 umi-plugin-library。
father:https://github.com/umijs/father
umi-plugin-library:https://github.com/umijs/umi-plugin-library
umi 作者 sorrycc 錄制的視頻使用教程:
https://www.bilibili.com/video/av47853431
搭建工程
在 father 的 github 倉庫中,它並沒有提供搭建教程或腳手架,而是直接在 README.md 中寫使用文檔。
搭建方式
經過一番折騰和研究,發現搭建起工程有兩種方式,
- 參照視頻教程,從零開始搭建;
- 使用 umi v2 版本中提供的腳手架;
搭建過程
至於第一種方式我不過多闡述,照着視頻即可,在此更多的是說第二種方式:使用 umi v2 提供的腳手架。
具體創建過程如下圖:
其中有幾個選項,可自行根據情況選擇或填寫。
注意事項
使用 umi 腳手架搭建的 father 依賴版本是 2.16.0,估計是阿里的人懶得維護升級了,不過我自行嘗試過升級,可正常啟動、打包。
結語
剩下的就是自行根據 github 倉庫的 issue 、作者的視頻教程和官方文檔進行探索了。
文檔一
https://github.com/umijs/father/blob/2.x/README.md