一、初步认识pug

1.所谓的pug就是我们之前说的jade,也就是一种通过缩进的方式来编写代码的过程,在编译的过程中,我们不需要考虑标签是否闭合的问题。此外,用这种编译方式,加快了我们写代码的速度,也为代码复用提供了便捷。

2.在学习pug基础语法之前,首先要了解pug的命令行的使用,例如:

  1. doctype html
  2. html
  3. head
  4. title aaa
  5. body

在文件里面写上述程序,然后以xxx.pug的格式保存,再再终端命令输入 pug xxx.pug,按下回车键,我们在回到之前的项目编译器,就会发现在编译器内出现了与xxx同名的xxx.html文件,点开之后会发现html 基础格式已经打印出来了。但是这里有一个问题,基础格式的排版并不像我们平时书写的格式,这里就需要我们在将pug格式转化为HTML的时候输入命令 pug -P xxx.pug;就可以得到我们想要的格式了。为了实时自动更新出现我们修改后的代码样式,我们还可以这样输入终端命令:pug -P -w xxx.pug;不想继续更新,快捷键为:ctrl+c.

3.路径设置

如果并不希望在当前目录下输入编译后的HTML文件,而是有自定义目录的需求,则需要设置-o参数

如下设置,index.html将输入到a目录下面,如果a目录不存在,则会新建a目录:

  1. pug index.pug -o a

4.批量编译:

假设编译href下的所有pug文件,则可以这样写:pug href

5.结构语法:

标签

【树状】

在默认情况下,在每行文本的开头(或者紧跟白字符的部分)书写这个 HTML 标签的名称。使用缩进来表示标签间的嵌套关系,这样可以构建一个 HTML 代码的树状结构

  1. ul
  2. li Item A
  3. li Item B
  4. li Item C .

持续更新,欢迎大家指教!

初步认识pug的更多相关文章

  1. 移动端之Android开发的几种方式的初步体验

    目前越来越多的移动端混合开发方式,下面列举的大多数我都略微的尝试过,就初步的认识写个简单的心得: 开发方式 开发环境 是否需要AndroidSDK 支持跨平台 开发语言&技能 MUI Win+ ...

  2. CSharpGL(29)初步封装Texture和Framebuffer

    +BIT祝威+悄悄在此留下版了个权的信息说: CSharpGL(29)初步封装Texture和Framebuffer +BIT祝威+悄悄在此留下版了个权的信息说: Texture和Framebuffe ...

  3. Android自定义View初步

    经过上一篇的介绍,大家对于自定义View一定有了一定的认识,接下来我们就以实现一个图片下显示文字的自定义View来练习一下.废话不多说,下面进入我们的正题,首先看一下我们的思路,1.我们需要通过在va ...

  4. 初步认识Node 之Node为何物

    很多人即便是在使用了Node之后也不知道它到底是什么,阅读完本文你应该会有一个初步的.具体的概念了.    Node的目标 提供一种简单的构建可伸缩网络程序的方法.那么,什么是可伸缩网络程序呢?可伸缩 ...

  5. [入门级] 基于 visual studio 2010 mvc4 的图书管理系统开发初步 (二)

    [入门级] 基于 visual studio 2010 mvc4 的图书管理系统开发初步 (二) Date  周六 10 一月 2015 By 钟谢伟 Category website develop ...

  6. 基于C/S架构的3D对战网络游戏C++框架 _05搭建系统开发环境与Boost智能指针、内存池初步了解

    本系列博客主要是以对战游戏为背景介绍3D对战网络游戏常用的开发技术以及C++高级编程技巧,有了这些知识,就可以开发出中小型游戏项目或3D工业仿真项目. 笔者将分为以下三个部分向大家介绍(每日更新): ...

  7. Azure底层架构的初步分析

    之所以要写这样的一篇博文的目的是对于大多数搞IT的人来说,一般都会对这个topic很感兴趣,因为底层架构直接关乎到一个公有云平台的performance,其实最主要的原因是我们的客户对此也非常感兴趣, ...

  8. CozyRSS开发记录14-RSS源管理初步完工

    CozyRSS开发记录14-RSS源管理初步完工 1.添加源的响应 DialogHost.Show有几个版本的重载,加一个DialogClosingEventHandler参数.我们让添加源对话框的添 ...

  9. 初步了解CPU

    了解CPU By JackKing_defier 首先说明一下,本文内容主要是简单说明CPU的大致原理,所需要的前提知识我会提出,但是由于篇幅我不会再详细讲解需要的其他基础知识.默认学过工科基础课. ...

随机推荐

  1. 【ABAP系列】SAP webservice HTTP框架出错 404错误

    公众号:SAP Technical 本文作者:matinal 原文出处:http://www.cnblogs.com/SAPmatinal/ 原文链接:[ABAP系列]SAP webservice H ...

  2. mac安装pip并升级pip版本

      最近想安装inchat,直接使用命令pip install install,结果提示 使用提示中的命令升级,结果提示找不到pip.很郁闷,明明有pip,结果一升级还给升没了.最后用的是这个方法完美 ...

  3. python self和cls的区别

    1.self表示一个具体的实例本身.如果用了staticmethod,那么就可以无视这个self,将这个方法当成一个普通的函数使用. 2.cls表示这个类本身.

  4. C++学习笔记(二)--基础

    1.浮点型数值不管写成什么样 都是以指数形式保存在内存中 数符|数字部分|指数部分 例:+0.33E10 数字部分的整数部分不能大于1,小数点后面不能是0. 2.字符数据是以整数形式保存在内存中的(A ...

  5. tensorflow学习框架(炼数成金网络版学习记录)

    chapter1 #变量 import tensorflow as tf x = tf.Variable([1,2]) a = tf.constant([3,3]) #增加一个减法op sub = t ...

  6. 《JAVA设计模式》之策略模式(Strategy)

    在阎宏博士的<JAVA与模式>一书中开头是这样描述策略(Strategy)模式的: 策略模式属于对象的行为模式.其用意是针对一组算法,将每一个算法封装到具有共同接口的独立的类中,从而使得它 ...

  7. [Linux] 016 压缩解压命令

    1. 压缩解压命令:gzip 命令名称:gzip 命令所在路径:/bin/gzip 执行权限:所有用户 语法:gzip [文件] 功能描述:压缩文件 压缩后文件的格式:.gz 补充: 解压 .rar ...

  8. Python 学习笔记18 异常处理

    我们在编码的过程中,难免会遇到一些错误和异常, 这时候程序会异常退出,并且会抛出错误信息: 比如: print(1/0) ''' 输出: Traceback (most recent call las ...

  9. Docker配置远程访问

    近来学习Docker部署微服务,需要配置Docker的远程访问,由于实际环境和学习资料有出入,尝试着根据网上搜索的一些相关资料进行配置,未能成功.最终通过自己摸索,成功配置Docker远程访问.现和大 ...

  10. php提交表单时如何保留多个空格及换行的文本样式

    需求是:用户提交表单时屏蔽敏感词的功能.其中敏感词来自服务器端同一路径下的ciku.txt,敏感词通过"|"连接,例如"g|c|a",提交表单时替换敏感词,更重 ...