Pug 遷移到 Pug v2

2020-02-07 16:27 更新

遷移到 Pug v2

Pug v2 已經(jīng)在 2016 年 8 月發(fā)布。為了盡可能改善新版本的體驗(yàn),我們不得不作出決定,移除、或者不贊成使用一些 API 和未歸檔的特性。我們努力讓這些變更盡可能不具破壞性。當(dāng)前,這些變更大多數(shù)會(huì)以控制臺(tái)輸出的方式進(jìn)行警告。

此頁(yè)面將詳細(xì)介紹您應(yīng)該如何將代碼從舊版本遷移到最新版本的 Pug 上。

新的名稱(chēng)

因?yàn)樯虡?biāo)方面的問(wèn)題,這個(gè)項(xiàng)目的名稱(chēng)已經(jīng)在 Pug v2 發(fā)布之際從“Jade”變更為“Pug”。這也意味著官方支持的文件擴(kuò)展名從 .jade 變?yōu)?nbsp;.pug。盡管依然支持 .jade,但這是不贊成的,我們建議所有的用戶都立刻將其改為 .pug。

已經(jīng)移除的語(yǔ)言特性

絕大多數(shù)被移除的內(nèi)容都可以被 pug-lint 自動(dòng)檢測(cè)出來(lái),這是我們官方提供的代碼規(guī)范器。

傳統(tǒng) Mixin 調(diào)用

//- 舊版本

mixin foo('whatever')
//- 新版本

+foo('whatever')

我們移除了傳統(tǒng)的調(diào)用 mixin 的語(yǔ)句,這樣可以更容易區(qū)分 Mixin 的聲明和調(diào)用。所有這類(lèi)舊語(yǔ)句在 Jade v1 里都已經(jīng)警告。

屬性嵌入

//- 舊版本

a(href='#{link}')

a(href='before#{link}after')
//- 新版本

a(href=link)

//- (在 Node.js/io.js ≥ 1.0.0)
a(href=`before${link}after`)
//- (任何場(chǎng)合)
a(href='before' + link + 'after')

我們移除了在標(biāo)簽屬性里的嵌入支持。它給實(shí)現(xiàn)平添了不必要的復(fù)雜度,而且也讓用戶不易注意到屬性的賦值其實(shí)可以是任意的 JavaScript 表達(dá)式。閱讀屬性的文檔來(lái)了解更多關(guān)于標(biāo)簽屬性的語(yǔ)法。

帶有前綴的 each 語(yǔ)法 ~~ Prefixed each Syntax

//- 舊版本

- each a in b
  = a

- for a in b
  = a
//- 新版本

each a in b
  = a

for a in b
  = a

這里的 each 并非 JavaScript 的語(yǔ)法,在 JavaScript 代碼行中使用 each“關(guān)鍵字”會(huì)讓人感到非常困惑。沒(méi)有括號(hào)的 for 關(guān)鍵字也是同樣的情況。

只需要簡(jiǎn)單地刪去 -,您的代碼應(yīng)該就能重新工作。

已刪除的 API

以下導(dǎo)出屬性和編譯選項(xiàng)已經(jīng)被移除。請(qǐng)確保您的代碼沒(méi)有使用它們。

屬性

doctype

此前,未歸檔的對(duì)象 jade.doctype 是一個(gè)存放 doctype 縮寫(xiě)的哈希表。用戶可以通過(guò)擴(kuò)充這個(gè)對(duì)象來(lái)自定義額外的 doctype 縮寫(xiě),或者修改已有的 doctype 縮寫(xiě)。

在 Pug v2 中,這個(gè)對(duì)象已經(jīng)從 Pug 分離出來(lái),單獨(dú)成為一個(gè)叫做 doctypes 的包。如果您要擴(kuò)充 doctype 縮寫(xiě),可以寫(xiě)成一個(gè) codeGen 的插件。

nodes

此前,未歸檔的對(duì)象 jade.nodes 是一個(gè)存放(未歸檔的)Jade 抽象語(yǔ)法樹(shù)節(jié)點(diǎn)的構(gòu)造函數(shù)的哈希表。

在 Pug v2 中,我們棄用了這種做法,取而代之的是使用抽象語(yǔ)法樹(shù)節(jié)點(diǎn)的 type 屬性實(shí)現(xiàn)鴨子類(lèi)型。

selfClosing

此前,未歸檔的數(shù)組 jade.selfClosing 可以用于添加或者修改自閉合標(biāo)簽的條目。

在 Pug v2 中,這個(gè)數(shù)組已經(jīng)從 Pug 分離出來(lái),單獨(dú)成為一個(gè)叫做 void-elements 的包。如果您要修改這個(gè)數(shù)組,可以寫(xiě)成一個(gè) codeGen 的插件。

utils

此前,jade.utils 對(duì)象包含了三個(gè)模板引擎內(nèi)部比較有用的函數(shù):

utils.merge 已經(jīng)從 Pug 中移除并不再使用。其功能大體上可以用 ECMAScript 2015 的 Object.assign 方法及其他變種來(lái)實(shí)現(xiàn)。

utils.stringify 已經(jīng)從 Pug 分離出來(lái)到叫做 js-stringify 的包,同時(shí)有額外的跨站腳本攻擊保護(hù)。建議所有用戶都改用此代碼包。

utils.walkAST 已經(jīng)分離到一個(gè)叫做 pug-walk 的包。

Compiler, Lexer, Parser

此前,未歸檔的 Jade 的編譯器(Compiler)、詞法分析器(Lexer)和解析器(Parser)通過(guò)這三個(gè)屬性導(dǎo)出。用戶可以從這些類(lèi)創(chuàng)建自己的編譯器、詞法分析器和解析器,從而自定義編譯的行為。

Pug v2 允許通過(guò)插件自定義編譯的行為,同時(shí)移除這些導(dǎo)出屬性。

對(duì)應(yīng)到 Pug v2 中,這幾個(gè)類(lèi)現(xiàn)在已經(jīng)分為 pug-code-gen,pug-lexer 和 pug-parser 這幾個(gè)包,并且有各種與舊版本不兼容的變更。

選項(xiàng)

compiler, lexer, parser

這些選項(xiàng)曾被用于已經(jīng)被移除的 Compiler,Lexer 和 Parser 類(lèi)。

client

該選項(xiàng)曾用于模板函數(shù)的編譯。大約從 2013 年起不推薦使用,并用 compileClient 函數(shù)代替,從那時(shí)起已經(jīng)進(jìn)行了警告。


以上內(nèi)容是否對(duì)您有幫助:
在線筆記
App下載
App下載

掃描二維碼

下載編程獅App

公眾號(hào)
微信公眾號(hào)

編程獅公眾號(hào)