EJSでコーディングする際にページ情報などをJSONで管理する方法 | オレインデザイン
npm script はこのように書いてます。 ejs-cli -b src/ejs/ '/**/*.ejs' -e 'components/' -o dest/ -O data.json 意訳すると、ベースディレクトリは src/ejs で拡張子が .ejs のファイルを対象にして、components ディレクトリは対象外に。そして、 dest/ を出力先にしてオプションで data.json を読み込むという感じですね。 雛形HTMLとJSON 雛形はこのようになります。 data.json { "data": { "header": { "index": { "title": "Pulvinar integer nunc inceptos eget lacus suscipit", "description": "Vel convallis luctus netus ultrici
Pug(Jade)の応用記法について - Qiita
HTMLをPug(Jade)で書くのは慣れたから、 どんどんPug(Jade)の機能使っていきたいぜー！ってなってきた時のために さくっと使いやすい応用記法をまとめました。 まだ「HTMLをPug(Jade)で書くことが慣れてないのよ」って方は、 こちらの記事を参考にしてもらえると良いかと思います Pug(Jade)の基本記法について 共通部分をパーツ化できる include 様々な箇所で共通ファイルを呼び出して使える 共通パーツ化したファイルはコンパイルされない仕組みを作っておくと良い head部分などは毎回同じ記述になるので別ファイルを作ってしまう 今回はcommonフォルダの中に_head.pugファイルを作成。 ▼Pug(Jade) //- common/_head.pug head title サイトタイトル script(src='/javascripts/jquery.js'
覚えるのはこれだけ！Pug(Jade)のよく使う9つの書き方 ｜ Tips Note by TAM
以前Pug(Jade)を使った制作環境を作る方法を紹介しました。 Pug(Jade)で効率的なマークアップ環境を作る 今回はPugでマークアップをしていくときに、よく使う書き方を紹介します。 ベースになるルールは9個あります。 タグ名はHTMLタグになる 改行をしてインデントをつければ入れ子になる インライン要素や改行にはパイプライン（|）を使う（ここだけ慣れが必要） HTMLはドット（.）で終わる要素の中に入れておけば解釈される 属性は丸括弧内に記述する クラス属性はドット（.）、ID属性はシャープ（#）で表す コメントにはHTMLとして出力されるものと、されないものがある イコール（=）を使えばエスケープできる インクルード（include [ファイル名へのパス]）で共通化したファイルを挿入できる Pugとはなにか？ Sassを使ってCSSを作成している人は多いと思いますが、PugはH
Pug(Jade)で効率的なマークアップ環境を作る ｜ Tips Note by TAM
HTMLのコーディングをするとき、メタ情報やヘッダーのような共通部分を効率的に管理するためにPugというテンプレートエンジンをよく使っています。最初は「導入コストが高い」と考えていましたが、それ以上のメリットがあると感じるようになりました。 今回はPugのテンプレートを作ったので、その使い方を紹介します。 今回はPugの記法については細かく説明できませんので、詳しい仕様は公式サイトを確認してください。 Getting Started – Pug テンプレートエンジンとPugについて テンプレートエンジンというのは、特定の処理をおこなうテンプレートに表示させたいデータ（文字列やタグなど）を渡すことで、無駄なくHTMLを作成していく仕組みのことです。CSSにおけるSassのようなものと考えてもいいと思います。 今回使用するテンプレートエンジンのPugには以下のような特徴があります。 閉じタグ（
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
