html 转 pug 在线,pug - HTML模板引擎安装器

一、我们知道，pug原名jade，能很大情况下增加代码的复用，从而减少项目的开发时间。现在简聊下pug的用法

二、pug安装(终端)

1、下载安装包，按照步骤傻瓜式安装  下载地址链接   https://nodejs.org/en/

2、在终端检查是否安装成功

node -v

npm -v

3、在 npm 中安装pug

sudo npm install pug-cli -g (sudo:代表以管理员身份进行安装，后续步骤需输入开机密码)

4、查询pug所有基本菜单命令

pug --help

5、找到对应要将 .pug转换成   .html 格式的 pug文件 位置

6、对 .pug 文件进行转换

pug -P  index.pug  (-P：保持原有格式输出)

6、监控pug 文件，自动生成 .html 文件

pug -P -w index.pug(-w：自动编译)

7、将pug放入相应文件夹a

pug  *.pug -o a(*.pug 相应的所有.pug 文件   如果没有a文件夹会自动生成)

三、pug文件复用代码( 代码实现。 .pug 都可省略)

1、include  aa.pug

代码完全复用，不可对内容进行修改，之间用 空格隔开

2、extends  可对内部定义的某块区域进行修改

①   extends index.pug (完全复用)

②    extends index.pug

block  source      (对index.pug内容中 source 区域进行修改)

四、pug语法

Script的写法：

(引入时， . 不可省；后的Script写法变)

一般写项目时，都有个公众的 .html