Movable Type のプラグイン、 RevReplace プラグイン を書いてみました。
当サイトではパフォーマンス向上のため、 CSS は1年間の有効期限を設定しています。そのため、 CSS の編集が発生した場合に備えて gulp-rev で CSS のファイル名にフィンガープリントを付与しており、 コンテンツハッシュの付いたファイル名 ... basic-cb0599cc.css のような形式になっています。そのため CSS を更新した際は、手動で HTML ヘッダーテンプレートを編集した後に再構築をする必要がありました。
※詳細は、昨年夏の記事「 Expires ヘッダの設定と、 gulp-rev を利用したフィンガープリントの付与」をご覧ください。
そこで、再構築時に gulp-rev が出力する rev-manifest.json をプラグインで読み込み、 CSS のパスを自動で書き換えるようにしたものです。これにより、手動でテンプレート内の CSS のファイル名を書きかえる手間が省けます。
ちなみに rev-manifest.json は、このような内容です。
{
"basic.css": "basic-cb0599cc.css"
}つまり、テンプレート内で basic.css を読み込むように指定しておけば、 rev-manifest.json の内容に沿って basic-cb0599cc.css に書き換えられます。
「Movable Type プラグイン開発入門」 を読み、build_page フックポイントを使うことは分かったので、あとは rev-manifest.json に基づいて CSS ファイル名を書きかえるロジックを書くのみでした。JSON の読み込み方と値の取得方法が分からなかったのですが、 Google 検索で答えらしきものを見つけて試したところ、意図通り動作しました。参考サイトはコード内に記載しております。
概ね問題無く動作しているのですが、検索結果画面で CSS ファイル名が書き換わらないので、違うフックポイントを指定しなければならないようなのですが、ちょっとよく分かりません。他にもいくつか伺いたいことがあるので、 MT Live! に行きたいところ。（でも平日に東京で開催なのでなかなか...。）