简介
grunt-contrib-pug 是一个基于 Node.js 平台的 npm 包，它可以让前端开发者更快速的编写 HTML。使用 grunt-contrib-pug 可以将 pug 模板转换为 HTML 文件，提高前端工作效率。
安装
使用 grunt-contrib-pug 前需要先安装 Node.js 和 Grunt，可以通过以下命令安装：
$ npm install -g grunt-cli $ npm install grunt-contrib-pug --save-dev
配置
在 Gruntfile.js 文件中添加以下代码：
-- -------------------- ---- -------
-------------- - --------------- -
------------------
---- -
-------- -
-------- -
------- -----
--
------ -
------------- ----------------
------------- ----------------
--
--
--
---
----------------------------------------
----------------------------- ---------
--操作
执行以下命令：
$ grunt
Grunt 将会自动将 src 目录下的 pug 模板转换为 HTML 文件，并存储在当前目录下。
选项
pretty
默认情况下，转换后的 HTML 文件将会去除额外的空格和缩进。如果想保留空格和缩进，可以设置 pretty 选项为 true。
options: {
pretty: true,
},示例代码
index.pug
-- -------------------- ---- -------
------- ----
---------------
----
----- ------- --- ----
----
-------
-- ---- -- --- ---------
-------
- ------- -- -- --------about.pug
-- -------------------- ---- -------
------- ----
---------------
----
----- ----- --
----
-------
-- ----- --- --------
-------
- -- --- - ----- ------- -------- ------- -- --- ----- -- --- -----在 src 目录下创建以上两个文件，执行 grunt 命令即可将它们转换为 HTML 文件。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64007