はじめに

この記事ではpugにおけるコメントの書き方を紹介する。

参考：pug公式サイト → Comments - Pug

1行コメント

出力される1行コメント

pug

// 出力される1行コメント
p foo
p bar

html

<!-- 出力される1行コメント-->
<p>foo</p>
<p>bar</p>

出力されない1行コメント

pug

//- 出力されない1行コメント
p foo
p bar

html

<p>foo</p>
<p>bar</p>

ブロックコメント

出力されるブロックコメント

pug

body
  //
    出力される
    ブロックコメント

html

<body>
  <!--出力される
ブロックコメント-->
</body>

出力されないブロックコメント

pug

body
  //-
    出力されない
    ブロックコメント

html

<body>
</body>

条件付きコメント

pugでは<で始まる行はプレーンテキストとして扱われるため、htmlで書かれた部分はそのまま表示される。

pug

doctype html

<!--[if IE 8]>
<html lang="en" class="lt-ie9">
<![endif]-->
<!--[if gt IE 8]><!-->
<html lang="en">
<!--<![endif]-->

body
  p コメントを用いてIEの古いバージョンに対応
</html>

html

<!DOCTYPE html>
<!--[if IE 8]>
<html lang="en" class="lt-ie9">
<![endif]-->
<!--[if gt IE 8]><!-->
<html lang="en">
<!--<![endif]-->

<body>
  <p>コメントを用いてIEの古いバージョンに対応</p>
</body>

</html>