本文作者：ivweb 程柳鋒
随着開發團隊不斷發展壯大，在人員增加的同時也帶來了協作成本的增加；業務項目越來越多，類型也各不相同。常見的類型有基礎元件、業務元件、基于React的業務項目、基于Vue的業務項目等等。如果想要對每個項目進行一些規範上的限制比如Git送出規範、Javascript規範簡直難于登天。所有的這些，隻是因為還欠缺一個好用的工程化工具，在項目建立的初期自動的将這些目錄結構和檔案生成、并且內建工程常見的規範來進行限制。
本文分為兩部分，首先會談談目前團隊的痛點以及基于yeoman generator的設計思路；然後會詳細介紹如何實作定制的generator，過程中遇到的問題和解決辦法。
代碼目錄檔案手工拷貝
不同場景的工程對目錄結構的要求不盡相同
難以在新的工程項目中內建新的規範，需要手動加hook
缺少增量機制對舊項目內建
我們需要給每個工程類型的項目建立一個generator。按照目前前端技術棧的發展情況來看，一個團隊一般會有3~5個generator。把這些generator看成一個個的插件，通過工具上層的CLI指令來暴露給開發者使用。
在generator之下，需要開發一系列服務和內建規範。包括和Git倉庫打通，也就是通過腳手架初始化目錄時，先對開發者鑒權。之後根據開發者輸入的項目名稱在遠端Git倉庫裡面建立倉庫并且授予開發者權限。後期功能完善之後，可以做一些錦上添花的工作，比如進行資料統計，分析各個業務倉庫使用的generator版本資訊，是否內建了最新的feature等等。
整體系統架構如下：
下面我準備開發一個适用于Now直播活動類搭建的腳手架了，名字是generator-now-activity
在generator的外層index.js檔案裡，通過繼承yeoman-generator來擴充我們自己的generator，然後子產品暴露給外部。
一個 Yeoman Generator 被建立後（構造函數必然是最先被調用的），會依次調用它原型上的方法，且每一個方法中的 this 都被綁定為 Generator 執行個體本身，調用的順序如下：
initializing - 初始化一些狀态之類的，通常是和使用者輸入的 options 或者 arguments 打交道，這個後面說。
prompting - 和使用者互動的時候（指令行問答之類的）調用。
configuring - 儲存配置檔案（如 .babelrc 等）。
default - 其他方法都會在這裡按順序統一調用。
writing - 在這裡寫一些模闆檔案。
conflicts - 處理檔案沖突，比如目前目錄下已經有了同名檔案。
install - 安裝依賴
end - 結束部分
Yeoman提供了API來讓generator和使用者進行互動，直接通過this.prompts函數，它的内部實作是使用了Inquire.js。
對于工程src目錄部分直接通過深度優先算法拷貝寫入。對于工程的規範類、配置的檔案需要單獨寫入，這一類可能需要接受使用者的輸入，同時需要集中進行維護，是以需要和src的拷貝方式進行區分。
src深度優先拷貝代碼如下：
在外層通過Yeoman提供的API this.fs.copy()方法來進行檔案拷貝
開發完generator之後，就可以通過yo now-activity來進行使用了。
前面提到的yo now-activity的方式使用可能存在一些問題，因為這種方式要求代碼必須上傳到github上。對于公司内部的工具，不走正常的開源流程顯然是不被允許的。那麼，有沒有什麼方法，不添加generator到Yeoman的generator清單裡就能夠使用呢？
幸運的是，Yeoman提供了yeoman-environment來幫助我們在其它工具中內建編寫好的generator，yo其實也隻是yeoman-environment暴露到上層的一個指令而已。
為了友善本地調試看效果，在generator根目錄下運作 tnpm link
使用Yeoman提供的API this.log來列印資訊，而不要使用console.log
如果是内部工具，運作的時候指令為：yo @tencent/now-activity
安裝示例（限内部）
Yeoman Generator API
WRITING YOUR OWN YEOMAN GENERATOR
Spring Boot + Angular projects
原文連結：http://www.ivweb.io/topic/58d92e3fdb35a9135d42f840