Post

Jekyllのテーマを変える

当初使っていたテーマはシンプルで気に入っていたのですが、記事が増えてくるにつれて「カテゴリ」や「タグ」などの整理機能がほしくなってきました。やっぱり、ある程度情報が多くなってくると、構造化されているテーマのほうが管理しやすいなーという。 というわけで、見やすいかつ使い勝手のよいテーマに変更することにしました。

本当は Cloudflare Pages でホスティングしたかったのですが、新しいテーマとの相性が悪く、どうしてもうまくデプロイできず…。1時間くらい試行錯誤してみたものの、にっちもさっちもいかず、やむなく断念しました。

ローカル環境では問題なく動作していたのですが、ビルド時に SCSS 関連のエラーが出ており、Cloudflare Pages 側で解決するのは難しそうだと判断しました。

参考: Conversion error: Jekyll::Converters::Scss encountered an error while converting ‘/assets/css/main.scss’

File to import not found or unreadable: vendor/breakpoint/breakpoint #1606

流れ

すぐに完全移行せず、段階的に進めることにします。 最終的には GitHub Pages と Cloudflare Pages の両方でデプロイできるようにしておくと柔軟性があるので、少し蛇足かもしれませんが以下の流れで対応することにします。

  1. github pages で公開できるように変更する
  2. Cloudflare Pagesで公開する

候補

テーマをいろいろ調べた中で、見た目が洗練されていて、かつタグやカテゴリ機能がしっかりしているものを選びました。やっぱりデザインが「シュッとしてる」ほうが気分が上がりますね。

https://github.com/cotes2020/jekyll-theme-chirpy

GitHub Pages での公開方法の変遷と GitHub Actions でのデプロイの詳細

GitHub Pages では従来、以下のような方法で静的サイトの公開が行われていました:

gh-pages のブランチを指定して公開

自動で公開するためのデプロイのアクションが実行されるのでそれでお任せ。

この方式は手軽でしたが、Jekyll のビルドを GitHub 側で行う場合、GitHub が許可する Jekyll プラグインの制限があり、自由なカスタマイズが難しいというデメリットがありました。

Jekyllのバージョンが古かったり、互換性の問題とかいろいろ。。。

github pages で公開できるように変更する

まずは GitHub Pages による公開環境を整えます。

以前は特定のブランチを指定してデプロイしていましたが、最近では GitHub Actions を使ってより柔軟にデプロイできるようになっています。どうやら2022年頃から公式にサポートされたようです。

今回はその仕組みを使って、自動デプロイ環境を整えていきます。 この方法なら、カスタムビルドやプラグイン使用時でも問題が起こりにくく、将来的な保守もしやすくなりそうです。

Cloudflare Pagesで公開する

別記事でやる

This post is licensed under CC BY 4.0 by the author.