Pugを使ってみる

お久しぶりです。

8月は出向先が終わる月だったのでいろいろ忙しかったです。
現在は新しい出向先でフロントの開発をしています。
サーバーやりたいです。。

Pug(Jade)

前まではJadeという名で通っていたらしいです。
HTMLを書くテンプレートエンジンのことらしいですが、現場で使うので覚えているとこです。

ちょっと触ってみて

結構便利
タグで囲わなくて良いとか便利でした。
しばらくHTMLとか触らない間にEmmetなどいろいろ便利なものが増えてました。情報収集などの偏りが見えてしまいますね。。

あとは、includeとか変数とかループできるのはプログラミング風に書けるのでやりやすかったです。
でも出来ないこととかのルールがまだわからないので、ちょいちょい詰まりますね。

インストール

超簡単に説明!

Node.jsのインストール

Node.js
ここから

Pugのインストール
npm i pug-cli -g

はい、おしまい

pug --version

バージョン確認してOK

使い方

.pugでファイル作る

doctype html
html(lang="ja")
  head
    meta(charset="utf-8")
    title Pugテスト
  body
    h1.sitettl Pugテストサイトタイトル

↑内容

pug index.pug

コンパイルすると、index.htmlが同じディレクトリにできてるよ!
でも、これだと1行で生成しちゃうので、

pug index.pug --pretty

これでOK