exampleSiteのローカルサーバ起動やビルドを1行で実行する
Hugoのテーマ作成時、テーマのリポジトリ内にexampleSiteを配置した状態で、以下を実現する方法を探しました。
- テーマ開発時、リポジトリ構成のまま動作確認(
hugo server
を実行)できるようにする - exampleSiteを使って、Netlifyへデモサイトをビルド・デプロイする
- 公式テーマリストへの登録要件を満たすリポジトリ構成
解決したい問題
Hugoのテーマを公開する際、hugoBasicExampleの構成がテーマに合わない場合は、サンプルをexampleSiteとして含める必要があります。
以下、exampleSiteを入れたリポジトリの例としてInkblottyを使用します。 https://github.com/tosi29/inkblotty
このテーマ(Inkblotty)を例にすると、Hugoでサイトを構築する場合は以下のような構成を作ることになります。
root/
├ themes/
│ └ inkblotty/
│ └ ...
├ content/
│ └ post/
│ └ ...
├ config.toml
└ ...
この構成では、root
でhugo
やhugo server
を実行することでビルドやローカルサーバ起動ができます。
一方、テーマのリポジトリは以下の構成を取ります。
inkblotty/
├ exampleSite/
│ ├ content/
│ │ └ post/
│ │ └ ...
│ └ config.toml
└ ...
ここでexampleSite
以下の構成は前述のroot
以下に対応しており、このままではhugo
やhugo server
を正しく実行することができません。
しかし動作確認用のローカルサーバ起動や、ビルド・デプロイのためにディレクトリ構成を変更するのもイマイチなので、手軽に実行する方法を探しました。
exampleSiteでテーマの動作確認を行う方法
テーマのルートディレクトリ(前述の例ではinkblotty
)で、以下のように記事やコンフィグファイルを指定して実行すればOKです。
hugo server -c ./exampleSite/content/ --config ./exampleSite/config.toml
hugo server
が実行できるようになります。
exampleSiteをビルドする方法
同様に、exampleSiteをビルドしたい場合は、以下を実行すればOKです。
hugo -c ./exampleSite/content/ --config ./exampleSite/config.toml --baseURL https://hugo-theme-inkblotty.netlify.com/
baseURLにはデプロイ先のURLを指定しており、今回はNetlifyを指定しています。
これは./exampleSite/config.toml
の中ではbaseURL = "https://example.com/"
を指定する必要がある1ため、その設定を上書きしています。
これならNetlifyでビルドコマンドを記述する際も一行で指定できるので、デモサイトを容易に公開できるようになります。
所感
実はやや諦め気味だったのですが、hugo help
を実行して試行錯誤したらさくっと解決しました。
終わってみればhugoのオプションを指定しただけだったので、公式情報を読む重要性を再認識しました。
HugoとNetlifyはとても相性がよいので、今後このサイトも移行しても良さそうかなーと思ってます。