Hugoの導入とAzure Static Webappsへの連携
2025-02-10
※注意:以下は生成AIにて作成した記事になります。実際に行った手順は記載のとおりですが、一部実際と異なる可能性があることをご理解ください
感動のデプロイ!~エラー修正とHugoサイトコンテンツ作成ガイド~
はじめに
この度、Azure Static Web Apps へのデプロイに成功しました!
数々のエラーを乗り越え、技術と挑戦の結晶としてこの瞬間を迎えられた喜びは、言葉では表しきれません。
ここでは、デプロイ時に発生した以下の2つのエラーの修正方法と、Hugo を用いたサイトコンテンツの作成手順をご紹介します。
発生したエラーとその修正方法
エラー1: Hugo バージョンの不整合
エラーメッセージ例:
WARN Module "ananke" is not compatible with this Hugo version: Min 0.128.0; run "hugo mod graph" for more information.
原因:
Ananke テーマは Hugo のバージョン 0.128.0 以降を必要としますが、ビルド時に使用されていた Hugo バージョンが 0.124.1 だったため、この警告が発生しました。
解決策:
GitHub Actions のワークフローで Hugo のバージョンを上書きするため、環境変数 HUGO_VERSION
を指定します。
以下のように、ワークフローの該当ジョブに環境変数を追加してください。
- name: Azure Static Web Apps Deploy
uses: Azure/static-web-apps-deploy@v1
env:
HUGO_VERSION: '0.128.0' # Hugo バージョンを指定
with:
azure_static_web_apps_api_token: ${{ secrets.AZURE_STATIC_WEB_APPS_API_TOKEN }}
action: upload
app_location: "/" # プロジェクトルート(hugo.toml がある場所)
output_location: "public" # Hugo の出力ディレクトリ
github_id_token: ${{ secrets.GITHUB_ID_TOKEN }}
また、ローカル環境でも Hugo をバージョン 0.128.0 以上にアップデートしてからビルドするようにしてください。
エラー2: Sass フィールドの評価エラー
エラーメッセージ例:
ERROR ...: can't evaluate field Sass in type interface {}
原因: Hugo の古いバージョンでは、Ananke テーマ内で Sass の処理を正しく評価できず、エラーが発生していました。
解決策: こちらも、上記と同様に Hugo のバージョンを 0.128.0 以上に更新することで解決できます。 ワークフロー内で HUGO_VERSION を指定するか、ローカルで Hugo のアップデートを行ってください。
感動のデプロイ成功! すべてのエラーを解消し、ついにデプロイに成功しました! この成功は、技術への挑戦と日々の努力の結晶です。 新たな可能性への一歩として、今後も革新と成長を続ける決意を胸に、次なる挑戦へ進んでいきます!