開発環境にglup+EJSを導入したよ

gulp-ejsの導入メモです。ググると結構古い情報も混在してて、なかなかハマりました。

導入のきっかけ

SIRIUSテンプレートのAMP対応がやりたくて、cssをインクルードするのにHTMLのテンプレートエンジンが便利そうだなということでgulpを導入してgulp-ejsをインストールしました。

実は今までタスクランナーを使ったことなくて、Sassのコンパイルやminifyといった作業は全部Atomのパッケージで済ませていました。あとこまごましたものはバッチファイルを作って直接実行したりとか。

タスクランナー自体ずっと気になってたので、この機に導入できてよかったです。

SIRIUS案件で使用するにあたり、タグのデリミタ<% %>がSIRIUSの独自タグと被ってるのが懸念でしたが、変更が効くという噂を聞いて導入しました。

ところが変更できなくなったという情報を得てちょっと慌てましたが、ふつうにreplacceすることで対応しました。

導入する

以下の通りにやります。 テンプレートエンジン「EJS」とタスクランナー「Gulp.js」で爆速HTMLコーディング | 株式会社LIG

HTMLファイルに出力する

ところが上記の記事はちょっと古くて一部情報をアップデートする必要があります。

HTMLファイルに出力するためには、いろんな情報があったんですが上手くいかなくて、最終的に以下を参照することで成功しました。 gulp-ejs使用時に拡張子を変更してdestする方法 | NxWorld

まとめ

ニッカ・ザ・麦焼酎 25度 瓶 700ml

Amazon

楽天

これは今この記事を書きながら飲んでる酒です。香りはほぼウィスキー。割らずに飲んでも度数は焼酎並みなので、カスクの弱い版のウィスキーみたいな感じでパカパカ飲めます。コスパ高し。