なんかサイトが重いなあ、CDNなはずなんだがなあと思い調べてみるとNetlifyは高いプランにしないとシンガポールに飛ばされるようだということが判明。さてどうしたものかと考えて、Firebase Hostingに引っ越すことを思い立った。

そもそも、このサイトの構成

今年の3月にリニューアルした際に、VPS+手書きHTMLからHugo + Academic + GitLab + Netlifyに引っ越しした。

GitLabへプッシュしたらNetlifyでビルド＆デプロイ、slackへ通知する様にしていた。

GitLab CIでデプロイする

だいたい ここと ここを参考にして作業をした。

Hugo + firebase CLIなdocker image

GitLab CIで使うDocker Image nohitme/hugo-firebaseはしばらくメンテされていなかったので、これをforkしてひとまず現在使っているHugoバージョン(0.66)用のイメージを作成して挑む。

が、すんなりいかない・・・

Building sites … ERROR 2020/09/20 02:44:26 Transformation failed: TOCSS: failed to transform "main_parsed.scss" (text/x-scss): resource "scss/scss/main.scss_6c95cc1249b26b124274204dbf970c34" not found in file cache. Check your Hugo installation; you need the extended version to build SCSS/SASS.
ERROR 2020/09/20 02:44:27 render of "page" failed: execute of template failed: template: _default/single.html:4:3: executing "_default/single.html" at <partial "site_head" .>: error calling partial: "/builds/fujiba/www.fujiba.net/themes/academic/layouts/partials/site_head.html:131:56": execute of template failed: template: partials/site_head.html:131:56: executing "partials/site_head.html" at <resources.Concat>: error calling Concat: resources in Concat must be of the same Media Type, got "text/x-scss" and "text/css"
ERROR 2020/09/20 02:44:27 render of "page" failed: execute of template failed: template: _default/single.html:4:3: executing "_default/single.html" at <partial "site_head" .>: error calling partial: "/builds/fujiba/www.fujiba.net/themes/academic/layouts/partials/site_head.html:131:56": execute of template failed: template: partials/site_head.html:131:56: executing "partials/site_head.html" at <resources.Concat>: error calling Concat: resources in Concat must be of the same Media Type, got "text/x-scss" and "text/css"
ERROR 2020/09/20 02:44:27 render of "page" failed: execute of template failed: template: _default/single.html:4:3: executing "_default/single.html" at <partial "site_head" .>: error calling partial: "/builds/fujiba/www.fujiba.net/themes/academic/layouts/partials/site_head.html:131:56": execute of template failed: template: partials/site_head.html:131:56: executing "partials/site_head.html" at <resources.Concat>: error calling Concat: resources in Concat must be of the same Media Type, got "text/x-scss" and "text/css"
ERROR 2020/09/20 02:44:27 render of "page" failed: execute of template failed: template: _default/single.html:4:3: executing "_default/single.html" at <partial "site_head" .>: error calling partial: "/builds/fujiba/www.fujiba.net/themes/academic/layouts/partials/site_head.html:131:56": execute of template failed: template: partials/site_head.html:131:56: executing "partials/site_head.html" at <resources.Concat>: error calling Concat: resources in Concat must be of the same Media Type, got "text/x-scss" and "text/css"
Total in 570 ms
Error: Error building site: failed to render pages: render of "page" failed: execute of template failed: template: _default/single.html:4:3: executing "_default/single.html" at <partial "site_head" .>: error calling partial: "/builds/fujiba/www.fujiba.net/themes/academic/layouts/partials/site_head.html:131:56": execute of template failed: template: partials/site_head.html:131:56: executing "partials/site_head.html" at <resources.Concat>: error calling Concat: resources in Concat must be of the same Media Type, got "text/x-scss" and "text/css"

んー、ローカルで同じイメージ使っても動くがなあと思いつつも、新規でcloneすると同じ様にコケる。でよくよく考えると、最初にAcademicでサイト生成したときも同じことやってた。

Hugo extendsが必要だったというオチ。

ということで、Hugo extendsを入れたイメージを作り直して無事、ビルドできました。

Hugo extendsが必要な人は以下からどうぞ。

DockerHub: fujiba/hugo-firebase

現在の.gitlab-ci.ymlはこんな感じで。

variables:
    GIT_SUBMODULE_STRATEGY: recursive
    GIT_SSL_NO_VERIFY: "true"

stages:
    - deploy

deploy:
    stage: deploy
    image: fujiba/hugo-firebase:0.66.0
    script:
        # build site
        - cd ${CI_PROJECT_DIR}
        - hugo --minify --gc -b ${URL}
        # upload
        - firebase deploy --token ${FIREBASE_TOKEN}
    only:
        - master

DNSレコード書き換え

こちらは、ダウンタイムをなくす様に気をつけながら作業。

Firebase Hostingでカスタムドメインを追加する。追加するのは、

• fujiba.net
  • www.fujiba.net へリダイレクト
• www.fujiba.net
  • リダイレクトなし

カスタムドメイン追加の「所有権の確認」では、「詳細設定」で「DNS TXTレコード」を選択する。 TXTレコードを、DNSレコードへ追加してしばらく（1時間くらい）待つと証明書のプロビジョニングが始まる。証明書がCDNへばらまき終わると、Aレコードに設定するIPアドレスの組が表示される様になるので、この値でDNSレコード書き換える。 もともと、Netlifyを使うために設定していたCNAMEは削除して追加、Aレコードは内容を書き換えて設定を反映させる。

あとは、DNSキャッシュが更新されれば晴れてFirebase Hosting側にアクセスされる様になる。

と、いうことで早くなったはず。

次は、Hugo Academicのバージョン上げるか。