ejs-html-loader いつまで放置されるの問題
Webpack上でejsをトランスパイルするのに必要な ejs-html-loader だが、この開発はかなり放置気味で webpack4への対応時にも対応が遅く、ユーザーはヤキモキさせられた。
現在、ejsは3.1.5が最新(2021/02/01現在)だが、以前の記事 の通り、ejs3.0.2 でのアップデートでの仕様変更に対応できておらず、ejs-html-loaderを利用するためには ejs3.0.1のまま利用するという方法を取るしかなく、修正したプルリクエストを送ったにも関わらず放置されており、2年以上放置されている状態だった。
自前で修正したものを公開してみた
そこで不本意ではあるが、forkして自前で修正を当てたものをを公開することにしたので、上記の対応で回避している方に使っていただければと思う。
bananacoffee/ejs-html-loader
https://github.com/bananacoffee/ejs-html-loader
インストール・使い方
ejs-html-loaderを削除する
npm remove ejs-html-loader
gitHubから bananacoffee/ejs-html-loader をインストールし、ejsをアップデートする
npm install -D bananacoffee/ejs-html-loader ejs
使用方法は現行の ejs-html-loader と同じなので迷うことはないと思われる。
他の webpack系ejsコンパイラも使ってみたが・・・・
自分が未だにejs-html-loaderを使い続けているのは、他のwebpack対応のejsコンパイラの性能が微妙という悲しい事情がある。
特に焦点が当たるのが以下の2つ
- includeで
.ejs
以外の拡張子が使えない(例:ejs-plain-loader)
.ejs
以外の拡張子を与えると何故か.ejs
を付け足してしまうお節介お役立ち機能。
せめてオプションで無効にできればいいのに。 - contextが使えない(例:ejs-compiled-loader)
以下のようにloader指定時に変数を渡したいのにできない。
例えばproduction環境かどうかで挙動を変えたり、コンパイル時のタイムスタンプを使ってキャシュ管理をしたりしたいのだ。
{
loader: 'ejs-html-loader',
options: {
context: {
sitename: 'hogehoge',
prod: argv.mode === 'production',
timestamp: +new Date()
},
}
}
この両方が使えるのが調べた限り ejs-html-loader しかなかった、という消極的な理由である。
多分、同じ思いの人が世界に10人くらいはいると思う。
これで心置きなく最新のejsを使っていただければ幸いだ。
あとがき
一応、npm test
の結果は 100% OK と出ており自分のプロダクション環境でも問題なく使えているが、coffeescriptには全く詳しくないため、変な所があれば指摘してほしい。