Vite＋Bun 利用時の GitHub Pages へのデプロイ方法 - ytak-sagit/game-of-life-react GitHub Wiki

手順

Vite公式サイトの解説通りに行えばOK

  1. vite.config.ts へ base パラメータを設定
  2. GitHub リポジトリ側の設定変更
  3. GitHub Actions ワークフローファイルの追加
  4. main ブランチへマージ、または、手動でワークフローを実行してデプロイ

1. vite.config.ts へ base パラメータを設定

  • デプロイした静的サイトのベースURLとして利用される
  • https://<USERNAME>.github.io/<REPO>/ にデプロイする場合、base を '/<REPO>/' と設定する
    • なお、リポジトリは https://github.com/<USERNAME>/<REPO> で表される

2. GitHub リポジトリ側の設定変更

  • <REPO> リポジトリで、Settings > Pages にアクセス
  • GitHub Pages の Build and deployment - Source を「GitHub Actions」へ変更

3. GitHub Actions ワークフローファイルの追加

  • Vite公式サイトのサンプルワークフローをベースにしてOK
  • Node.js/npm ではなく Bun を利用する場合、セットアップや依存ライブラリインストールは Bun へ変更する必要がある
  • 他、Bun のコマンドやアーティファクトのアップロードを行う際は、作業ディレクトリとして bun.lockb が置いてあるディレクトリを指定する必要がある

4. main ブランチへマージ、または、手動でワークフローを実行してデプロイ

  • ワークフロー実行後、https://<USERNAME>.github.io/<REPO>/ に意図した静的サイトがデプロイがされていればOK
⚠️ **GitHub.com Fallback** ⚠️