hugoのスタティックファイル管理

hugoのディレクトリ規約は、static/ディレクトリにグローバルなスタティックファイルを置くことを想定しています。hugoコマンドを実行するとpublic/ディレクトリに一式コピーします。

static/ディレクトリにはサブディレクトリを作成してファイル群を整理できます。

デプロイは設定の影響を受ける

static/内のコンテンツをpublic/にコピーする際、サイト設定の影響を受けます。
たとえば、 baseURLにサブディレクトリを指定した場合、public/<baseDir>/にコピーする挙動になります。 多言語設定がある場合には、言語ごとのディレクトリにコピーします。

これにより、static/sample.jpgをコンテンツから利用するとき<img src="/sample.jpg" />というpathで参照すると設定しだいでリンク切れが生じます。

デプロイの挙動は、じっさいにhugoコマンドを実行したうえでpublic/ディレクトリ内のファイルpathを確認する方法が手軽です。

relURL関数で絶対pathを生成

static/コンテンツのデプロイpathは自明ではないため、 relURL関数を用いて生成する方法が適切です。

<img src='{{ relURL "sample.jpg" }}' />

この場合、引数のファイルpathの冒頭に/を付けるべきではありません。
/sample.jpgと記載した場合の挙動は、公式リファレンスを参照してください。この形式の引数を指定したい用途はないでしょう。

テーマディレクトリも同様の構成

hugoコマンドはテーマのリソース一式も利用します。テーマのディレクトリ構成もサイト構成と同様です。
themes/<theme-name>/static/からもstatic/と同じ挙動でファイルをコピーします。

⁋ 2024/10/02↻ 2024/11/07
中馬崇尋
Chuma Takahiro