一、我們知道授舟,pug原名jade救恨,能很大情況下增加代碼的復(fù)用,從而減少項(xiàng)目的開(kāi)發(fā)時(shí)間∈褪鳎現(xiàn)在簡(jiǎn)聊下pug的用法
二肠槽、pug安裝(終端)
1擎淤、下載安裝包,按照步驟傻瓜式安裝 ?下載地址鏈接 ? https://nodejs.org/en/
2秸仙、在終端檢查是否安裝成功
node -v
npm -v
3嘴拢、在 npm 中安裝pug
sudo npm install pug-cli -g (sudo:代表以管理員身份進(jìn)行安裝,后續(xù)步驟需輸入開(kāi)機(jī)密碼)
4寂纪、查詢(xún)pug所有基本菜單命令
pug --help
5席吴、找到對(duì)應(yīng)要將 .pug轉(zhuǎn)換成 ? .html 格式的 pug文件 位置
6、對(duì) .pug 文件進(jìn)行轉(zhuǎn)換
?pug -P ?index.pug ?(-P:保持原有格式輸出)
6捞蛋、監(jiān)控pug 文件孝冒,自動(dòng)生成 .html 文件
pug -P -w index.pug(-w:自動(dòng)編譯)
7、將pug放入相應(yīng)文件夾a
pug ?*.pug -o a(*.pug 相應(yīng)的所有.pug 文件 ? 如果沒(méi)有a文件夾會(huì)自動(dòng)生成)
三拟杉、pug文件復(fù)用代碼( 代碼實(shí)現(xiàn)庄涡。 .pug 都可省略)
1、include ?aa.pug
代碼完全復(fù)用捣域,不可對(duì)內(nèi)容進(jìn)行修改啼染,之間用 空格隔開(kāi)
2宴合、extends ?可對(duì)內(nèi)部定義的某塊區(qū)域進(jìn)行修改
① ? extends index.pug (完全復(fù)用)
② ? ?extends index.pug
? ? ? ? block ?source ? ? ?(對(duì)index.pug內(nèi)容中 source 區(qū)域進(jìn)行修改)
四焕梅、pug語(yǔ)法
Script的寫(xiě)法:
(引入時(shí), . 不可守郧ⅰ贞言;后的Script寫(xiě)法變)
一般寫(xiě)項(xiàng)目時(shí),都有個(gè)公眾的 .html?