🤒

【共有メモ】Hugoベースの静的サイトをGithub Pagesでビルドするときのエラー対処法

に公開

概要

タイトル通りです.
Hugoで!!(ここが大事)作った静的サイトをGithubでBuildするときにどハマりしたエラーに対する(完全に個人的な)備忘録です.

究極の解決法

最終的な答えは, Buildしないこと!! でした💦

もう少し具体的に述べると, 作成した「Repository」の「Settings」ー>左タブ「Pages」を押すと, 上の画像のような「Build & Deployment」が表示される.

ここで, 右の「Static HTML」を押せば, RemoteにPUSHして後に, コードをBuildしないので, Build系のエラーはでない.
ローカルで先にBuildしておき, 作成した静的サイトをGithub PagesにPUSHすれば済む, ということである.

,,,とやっていることは大したことではない. なので, 「Build」でもいいのでは?と思われたかもしれないが, 「Build」させるとエラーがでてしまい, Deployまで進まず, 結果的にプロジェクトページ([organization_name].github.io)がいつまでも変更が反映されない事態となった.

もしBuildまでGithub Pagesでやりたい!という方は次のようなエラーにあうかもしれない

ビルドエラー1: No url found for submodule path

これは, Hugoで使用しているThemeがSubmoduleから参照されているが, それがまだ作成されていないですよ!!という意味らしい.
submodule かできていれば .gitmodulesというファイルがあるはず.
その中身は, 使用しているHugo themeのGithubのURLがはいっている.

例 PaperModの場合(サイト名はMypageSite)
[submodule "MypageSite/themes/hugo-PaperMod"]
	path = MypageSite/themes/hugo-PaperMod
	url = https://github.com/adityatelange/hugo-PaperMod

もしなければ, 自前で作っても良いし, 以下のコマンドを打っても良い

例 PaperModの場合
git submodule add https://github.com/adityatelange/hugo-PaperMod

困ったら以下のサイトを確認したらよい.
https://qiita.com/reiya018/items/99f52adfe9840a852d34
https://zenn.dev/mebiusbox/books/d7e6b96da51ed8/viewer/5e11af

https://git-scm.com/book/ja/v2/Git-のさまざまなツール-サブモジュール

submoduleとはなんぞや?という人向け

https://qiita.com/unvavo/items/a9c3c3cf58e6f3209bd6

NetfilyでHugoを扱った場合について

ビルドエラ−2:Date is not a valid datetime

なんだこれは?と思ったが, Github Docsにそのまんま載っている.

https://docs.github.com/ja/pages/setting-up-a-github-pages-site-with-jekyll/troubleshooting-jekyll-build-errors-for-github-pages-sites#date-is-not-a-valid-datetime

タイトルは, GitHub Pages サイトの Jekyll ビルドエラーに関するトラブルシューティングとなっている. 実はこっちの方が大事で, BuildをJekyllでやろうとした場合の不整合性で発生したエラーだと考えられる.

Jekyllは, Hugoに似た静的サイトの作成ツールである. また, Github Pagesの基本Buildとしても出ている(上図参照)
ただ, Jekyll と Hugoは別物なので, Hugo作成のサイトを, Jekyll向けのBuildをかけたらエラーがでるのは当然なのかな, と思う.

Jelyllについては公式サイトを見てください.
https://jekyllrb-ja.github.io

https://shopify.dev/docs/api/liquid/filters/date

コアな人向けに, Date is not a valid datetimeの意味である, Jekyllの型定義についても整理されている.

なので, Hugo向けのBuildを設定すればよいということになる.

具体的には, 「Repository」の「Settings」ー>左タブ「Pages」->「Build & Deployment」
で出てくる,「Browse all workflows」 を押し, 検索タブでHugoと入れると, 「Hugo by Github Actions」というものがでてくるので, これを選択する.

ここらへんの一連の処理は以下の記事が詳しい
https://note.com/hideki_ikemoto/n/n97a61f1ead6b

背景

勉強会のためのプロジェクトページをHugo + Github Pages で公開している.
ただ, この勉強会のページをチームメンバーで共同で開発(修正)していきたいとの要望がでてきた. そこで, 「Hugo型の静的サイトをどうすればチーム内でコードを共有し, 並行しながら開発できるか,,,?🧐」 という疑問にぶちあたった.[1]

結果的に, Github の Organization で Hugo型の静的サイトをチーム開発することを検討した.

ここまでは特に問題ないが, Organizationの機能であるGithub ActionsのBuild機能でエラーが多発してしまった.
色々調べたが, 結局のところGithub ActionsのBuild機能を切ってしまうのが楽だと,なったので切ってしまった...
手元でBuildしてからPUSHすれば済む話だったので, これで良いかと...

まとめ

大した内容ではないが, 個人的にどハマりしたので, 同じエラーで困らないように備忘録として残したかった. 同じく困っている人の助けになれば幸いである.

脚注
  1. 普段からgithubを使ったチーム開発を経験されている読者でであれば些細な問題かもしれないが...😇 ↩︎

Discussion