pug模板引擎(原jade)之 注释、条件、包含

pug 注释

带输出的注释
// 一些内容
p foo
p bar

编译:
<!-- 一些内容-->
<p>foo</p>
<p>bar</p>

不带输出的注释
//- 这行不会出现在结果里
p foo
p bar

编译:
<p>foo</p>
<p>bar</p>


块注释
body
  //-
    给模板写的注释
    随便写多少字
    都没关系。
  //
    给生成的 HTML 写的注释
    随便写多少字
    都没关系。

编译:
<body>
  <!--给生成的 HTML 写的注释
随便写多少字
都没关系。-->
</body>

 

pug 条件

- var user = { description: 'foo bar baz' }
- var authorised = false
#user
  if user.description
    h2.green 描述
    p.description= user.description
  else if authorised
    h2.blue 描述
    p.description.
      用户没有添加描述。
      不写点什么吗……
  else
    h2.red 描述
    p.description 用户没有描述

编译:
<div id="user">
  <h2 class="green">描述</h2>
  <p class="description">foo bar baz</p>
</div>

注:
unless user.isAnonymous
等价
if !user.isAnonymous

 

pug 包含

说明:包含(include)功能允许您把另外的文件内容插入进来。

doctype html
html
  include includes/head.pug
  body
    h1 我的网站
    p 欢迎来到我这简陋得不能再简陋的网站。
    include includes/foot.pug
    script
      include script.js

 

上一篇:idea常用快捷键


下一篇:JADE(Java Agent Development Framework)笔记