本文將介紹如何親手來(lái)完成一個(gè)yeoman的generator，以實(shí)現(xiàn)快速構(gòu)建最適合自己的項(xiàng)目。
本文將實(shí)現(xiàn)的generator起名為ngtimo，依照yeoman的命名規(guī)矩就叫做generator-ngtimo，是筆者這周末一晚上加一上午參考著yeoman官方給出的幾個(gè)generator(generator-generator、generator-node)給強(qiáng)行催生出來(lái)的，目前也已經(jīng)在github上托管并發(fā)布到npm。

實(shí)現(xiàn)效果

首先確保已經(jīng)全局安裝了yeoman，然后再全局安裝generator-ngtimo:

npm install -g generator-ngtimo

安裝完成后即可使用yo命令來(lái)進(jìn)行構(gòu)建:

yo ngtimo

然后順利的話(huà)yeoman會(huì)像下面這樣詢(xún)問(wèn)一系列構(gòu)建的配置，這里筆者選擇輸入項(xiàng)目名稱(chēng)為ng-test剩下的一路敲回車(chē):

順利的話(huà)如下圖這樣的項(xiàng)目結(jié)構(gòu)就誕生了，可以 cd 到項(xiàng)目目錄下(自動(dòng)執(zhí)行的 npm install 失敗的話(huà)再手動(dòng)
npm install 一下)，并運(yùn)行 npm run server 啟動(dòng)項(xiàng)目查看效果。

如果只是想要使用yeoman來(lái)快速進(jìn)行項(xiàng)目搭建的話(huà)，只需要找到一個(gè)喜歡的generator，像上文這樣全局安裝然后yo它就可以了！不過(guò)只是使用別人的generator會(huì)有些不自由而且考驗(yàn)對(duì)方的維護(hù)能力，就像筆者這個(gè)一時(shí)興起的ngtimo就才剛剛有了一個(gè)主模板而已，還需要做很多改進(jìn)和迭代。

如果想要自己來(lái)編寫(xiě)一個(gè)generator其實(shí)難度也非常小，yeoman官方甚至給出了一個(gè)generator-generator來(lái)幫助我們創(chuàng)建一個(gè)generator，筆者這個(gè)不成器的ngtimo也是yo generator給yo出來(lái)然后加以養(yǎng)成的 :)。

yeoman generator基本項(xiàng)目結(jié)構(gòu)

不想自己從零開(kāi)始寫(xiě)一個(gè)generator的話(huà)強(qiáng)烈推薦使用yeoman官方的generator-generator先把基本結(jié)構(gòu)構(gòu)建出來(lái):

npm install -g generator-generatoryo generator

yeoman的generator說(shuō)白也只是一個(gè)npm包，主要依賴(lài)yeoman-generator包來(lái)制定構(gòu)建規(guī)則，這里給出ngtimo的基本目錄結(jié)構(gòu):

構(gòu)建規(guī)則

現(xiàn)在主要著眼于generators/app/index.js，此文件是最主要的角色，定義了ngtimo要如何處理模板，如何與用戶(hù)交互等。筆者目前也只是照著比較成熟的generator在使用，存在片面之處還請(qǐng)包涵。

總覽index.js

整個(gè)index.js將導(dǎo)出一個(gè)擴(kuò)展了yeoman-generator的類(lèi)，就像這樣:

const Generator = require('yeoman-generator');// ...module.exports = class extends Generator { prompting() {  // ... } default() {  // ... } writing() {  // ... } install() {  // ... }}

內(nèi)部的這四個(gè)方法各有用處。

一、prompting方法

用于與用戶(hù)進(jìn)行交互，即在yo項(xiàng)目的時(shí)候，這老頭會(huì)