GitHub ActionsをつかってVuePress製ページを Github Pagesで公開してみる

GitHub Actions気になっていたけど使うチャンスがない...。と思っていたのですが、そういえばみんなでつくるダンジョンのドキュメントはVuePressでつくっていて、GitHubにPublic Repositoryとして存在していて、かつGitHub Pagesで公開していたのだった~ということを思い出しました。

今までは、VuePressのDeployingにある案内に倣って、お手元でシェルスクリプトを実行して公開する形をとっていたのですが、GitHub ActionsをつかってmasterブランチにPushされたときに自動でビルドし、公開されるようにしました。

今回作業したドキュメントのリポジトリはこちら。 github.com

このActionsをつかえばやりたいことができそう~ということで、これをつかいます。(ドキュメントが詳しく書いてあって分かりやすい!) github.com

概ね上記ページの Static Site Generators with Node.js の項のとおりのymlを置けばよさそうです。 VuePressのビルド済みページは ./docs/.vuepress/dist に生成されるので、 publish_dir の値は ./docs/.vuepress/dist になります。

GITHUB_TOKEN ってなんだろう...と思ったら、Action内でつかえる Personal Access Token みたいなものを自動的に生成してくれているのですね。(GitHubのドキュメントより

最終的に定義したワークフローはこちら。こんなかんじのymlを置くだけで、CIやCDがかんたんにセットアップできるのはとっても便利~。 minnade-dungeon-docs/publish.yml at master · piyoppi/minnade-dungeon-docs · GitHub

ということで、これでmasterブランチにPushされたらドキュメントが自動で更新されるようになりました。みんなでつくるダンジョンのドキュメントのここがおかしい!などがあれば、直接 @piyorinpa までご連絡いただいてもいいですし、Issueを立てていただいてもいいですし、マークダウン書けるぞ!という方はPull Requestをお待ちしております。

ではでは~。