逆引きマニュアル: Hugo: 静的ファイルに対してCache Bustingを行う方法(0.43以降)

投稿日: 更新日:
Hugo
Cache Busting

やりたいこと

Hugoのテンプレートで、 静的ファイルに対して、キャッシュバスティングを行う方法です。

前提条件

Hugo 0.43以降が必要です。

概要

Hugo 0.43から導入された、Hugo Pipes機能を使用します。

手順

例として、static/js/foo.jsに組み込む手順を記載します。

  1. ファイルをassetsディレクトリに移動します。パスはassets/js/foo.jsになります。
  2. テンプレートファイルに以下のように記載します1。
{{- $js := resources.Get "js/foo.js" | fingerprint -}}
<script src="{{ $js.RelPermalink }}"></script>{{ "" -}}

補足

この記事では別の解決方法を書いていましたが、その記述は削除しました。 何が書いてあるか知りたい場合は魚拓を参照してください。

  1. 最後の{{ "" -}}は、改行を取るための手法です。参考→出力されるHTMLを整形する ↩︎

外部サイト

マニュアル

  • Hugo
  • cache-busting: まだありません。