從零搭建腳手架詳細記錄(一) - 修改模板文件

上篇文章主要記錄了從 GitHub 上下載模板文件用狱,這次主要記錄用 Metalsmith 和 Handlebars 修改模板文件。

參考

基于node.js平臺的腳手架開發(fā)經(jīng)歷

模板文件

之前的模板文件是靜態(tài)的杯聚,下載下來后直接就使用了∽蛞洌現(xiàn)在我想根據(jù)用戶輸入惶洲,將 package.json 的 name 改了。很簡單裹粤,使用 handlebar 的語法终蒂,將package.json 的 name 改成如下:

……
"name": "{{projectName}}",
……

這樣子蜂林,Handlebars 在編譯時就會使用 metadata 里的 projectName 的值了。其他的一樣的道理拇泣,這里只以 name 為例噪叙。

Metalsmith 和 Handlebars

首先安裝:

npm install metalsmith handlebars

首先在 lib 下創(chuàng)建一個 generator.js 文件,在 go 函數(shù)中調(diào)用即可霉翔。修改模板的的功能在 generator.js 中實現(xiàn)睁蕾。修改模板分為以下幾步:

  • 下載模板文件(已實現(xiàn))
  • 將文件內(nèi)容提取出來,轉(zhuǎn)換為字符串
  • 使用 handlebar 將模板內(nèi)容字符串替換成用戶輸入的值
  • Metalsmith build 成最終文件
  • 刪除下載下來的模板文件
//generator.js
const Metalsmith = require('metalsmith')
const Handlebars = require('handlebars')
const rm = require('rimraf').sync
const chalk = require('chalk')
const _ = require('lodash')

module.exports = function(metadata = {}, source, destination = '.') {
 if (!source) {
  return Promise.reject(new Error(`無效的source:${source}`))
 }
 
 return new Promise((resolve, reject) => {
  Metalsmith(process.cwd())
   .metadata(metadata) //metadata 為用戶輸入的內(nèi)容
   .clean(false)
   .source(source) //模板文件 path
   .destination(destination) //最終編譯好的文件存放位置
   .use((files, metalsmith, done) => {
    Object.keys(files).forEach(fileName => { //遍歷替換模板
     if (!_.startsWith(fileName, 'src/font')) { //判斷是否為字體文件债朵,字體文件不用替換
      const fileContentsString = files[fileName].contents.toString() //Handlebar compile 前需要轉(zhuǎn)換為字符創(chuàng)
      files[fileName].contents = new Buffer(Handlebars.compile(fileContentsString)(metalsmith.metadata()))
     }
    })
    done()
   }).build(err => { // build
    rm('source')  //刪除下載下來的模板文件子眶,‘source’是路徑
    if (err) {
     console.log(chalk.red(`Metalsmith build error: ${err}`))
     return reject(err)
    } else {
     return resolve()
    }
   })
 })
}

需要注意的是,字體文件序芦、圖片等不能用 handlebar 替換臭杰。需要判斷一下。

到這里谚中,模板文件應(yīng)該就替換成功了渴杆。

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市宪塔,隨后出現(xiàn)的幾起案子磁奖,更是在濱河造成了極大的恐慌,老刑警劉巖某筐,帶你破解...
    沈念sama閱讀 218,607評論 6 507
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件比搭,死亡現(xiàn)場離奇詭異,居然都是意外死亡来吩,警方通過查閱死者的電腦和手機敢辩,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 93,239評論 3 395
  • 文/潘曉璐 我一進店門蔽莱,熙熙樓的掌柜王于貴愁眉苦臉地迎上來弟疆,“玉大人,你說我怎么就攤上這事盗冷〉√Γ” “怎么了?”我有些...
    開封第一講書人閱讀 164,960評論 0 355
  • 文/不壞的土叔 我叫張陵仪糖,是天一觀的道長柑司。 經(jīng)常有香客問我,道長锅劝,這世上最難降的妖魔是什么攒驰? 我笑而不...
    開封第一講書人閱讀 58,750評論 1 294
  • 正文 為了忘掉前任,我火速辦了婚禮故爵,結(jié)果婚禮上玻粪,老公的妹妹穿的比我還像新娘。我一直安慰自己,他們只是感情好劲室,可當我...
    茶點故事閱讀 67,764評論 6 392
  • 文/花漫 我一把揭開白布伦仍。 她就那樣靜靜地躺著,像睡著了一般很洋。 火紅的嫁衣襯著肌膚如雪充蓝。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 51,604評論 1 305
  • 那天喉磁,我揣著相機與錄音谓苟,去河邊找鬼。 笑死线定,一個胖子當著我的面吹牛娜谊,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播斤讥,決...
    沈念sama閱讀 40,347評論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼纱皆,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了芭商?” 一聲冷哼從身側(cè)響起派草,我...
    開封第一講書人閱讀 39,253評論 0 276
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎铛楣,沒想到半個月后近迁,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 45,702評論 1 315
  • 正文 獨居荒郊野嶺守林人離奇死亡簸州,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 37,893評論 3 336
  • 正文 我和宋清朗相戀三年鉴竭,在試婚紗的時候發(fā)現(xiàn)自己被綠了。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片岸浑。...
    茶點故事閱讀 40,015評論 1 348
  • 序言:一個原本活蹦亂跳的男人離奇死亡搏存,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出矢洲,到底是詐尸還是另有隱情璧眠,我是刑警寧澤,帶...
    沈念sama閱讀 35,734評論 5 346
  • 正文 年R本政府宣布读虏,位于F島的核電站责静,受9級特大地震影響,放射性物質(zhì)發(fā)生泄漏盖桥。R本人自食惡果不足惜灾螃,卻給世界環(huán)境...
    茶點故事閱讀 41,352評論 3 330
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望揩徊。 院中可真熱鬧腰鬼,春花似錦藐握、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,934評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至本谜,卻和暖如春初家,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背乌助。 一陣腳步聲響...
    開封第一講書人閱讀 33,052評論 1 270
  • 我被黑心中介騙來泰國打工溜在, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人他托。 一個月前我還...
    沈念sama閱讀 48,216評論 3 371
  • 正文 我出身青樓掖肋,卻偏偏與公主長得像,于是被迫代替她去往敵國和親赏参。 傳聞我的和親對象是個殘疾皇子志笼,可洞房花燭夜當晚...
    茶點故事閱讀 44,969評論 2 355

推薦閱讀更多精彩內(nèi)容