Pug指南
如何使用Pug模板引擎 Pug介紹 Pug長什麼樣子？ 安裝Pug 設置Pug作為Express的模板引擎 你的第一個Pug模板 在Pug中插入變量 插入函數返回值 為元素添加id和class屬性 設置doctype Meta標籤 添加腳本和樣式 內聯腳本 循環 條件語句 設置變量 增加變量的值 將變量賦值給元素值 迭代變量 包含其他Pug文件 定義塊 擴展基礎模板 注釋 可見 不可見 Pug介紹 什麼是Pug？它是一個用於服務端Node.js應用程序的模板引擎。 Express有能力處理服務端模板引擎。模板引擎允許我們將數據添加到視圖中，動態生成HTML。 Pug是一個舊東西的新名字。它是Jade 2.0。 由於商標問題，當該項目在2016年發布2.0版本時，名稱從Jade更改為Pug。您仍然可以使用Jade（又名Pug 1.0），但未來最好使用Pug 2.0。 也可以參考Jade和Pug之間的差異 Express使用Jade作為默認的模板引擎。如上所述，Jade是Pug的舊版本 - 具體而言是Pug 1.0。 儘管Jade的最後一個版本已經是3年前（在撰寫本文時，2018年夏季），但出於向後兼容的原因，它仍然是Express的默認版本。 Pug的官方網站是https://pugjs.org/。 Pug長什麼樣子？ p 您好，來自Flavio 此模板將創建一個內容為“您好，來自Flavio”的p標簽。 如您所見，Pug非常特殊。它將標簽名作為行中的第一個內容，其餘內容作為標簽中的內容。 如果您習慣使用使用HTML並插入變量的模板引擎（例如Handlebars，下面將進行介紹），您可能會遇到問題，尤其是當您需要將現有的HTML轉換為Pug時。這款將HTML轉換為Jade（非常相似，但與Pug稍有不同）的在線轉換器將非常有幫助：https://jsonformatter.org/html-to-jade 安裝Pug 安裝Pug非常簡單，只需運行npm install： npm install pug 設置Pug作為Express的模板引擎 在初始化Express應用程序時，我們需要設置它： const path = require('path') const express = require('express') const app = express() app.set('view engine', 'pug') app.set('views', path....