PugJS 基础知识和安装

简介

PugJS（之前称为 Jade）是一个高性能的模板引擎，它以简洁的语法和强大的功能在 Node.js 和浏览器中使用。PugJS 支持动态内容、循环、条件语句等常规模板功能，同时还支持模板继承，模板包含等高级功能。

安装

在 Node.js 中安装 PugJS 很容易。使用以下命令：

npm install pug

基础语法

PugJS 的语法以缩进来表示层次结构，类似于 Python。不同的是，PugJS 使用空格而不是制表符来表示缩进。

标签

在 PugJS 中，标签是指 HTML 元素，例如 p、div 或 a。在 PugJS 中创建一个标签很简单——只需要把标签名放在选择器中：

p This is a paragraph.
div This is a div.
a(href='#') This is a link.

类名和 ID

使用 . 和 # 来分别创建类名和 ID：

div.container
  h1#title This is the title.
  p.content This is the content.

属性

在 PugJS 中，属性用小括号包含，并且每个属性占据单独的行：

a(href='#', title='This is a link') This is a link.

模板变量

可以在 PugJS 模板中使用变量，例如：

p= name

迭代器

在 PugJS 中，可以迭代循环列表：

each item in items
  li= item

条件语句

在 PugJS 中，可以使用条件语句：

if user.loggedIn
  p Welcome back, #{user.name}!
else
  p Please log in to continue.

注释

在 PugJS 中，可以使用注释，它们与 HTML 注释类似：

// This is a comment.

总结

以上就是 PugJS 的一些基础语法和安装方法，它是一个非常不错的模板引擎，可以加快开发速度，提高开发效率。