feat: add PR preview deployments to GitHub Pages#16
Merged
Conversation
Add a 'PR Preview' workflow that deploys every pull request to a live preview URL on GitHub Pages (e.g. /pr-preview/pr-15/). Previews are automatically updated on push and removed when the PR is closed. Switch the main deploy workflow from the GitHub Pages API to the gh-pages branch approach so both the main site and PR previews coexist on the same branch. The main deploy preserves the pr-preview/ directory when pushing to avoid wiping active previews. Also update vite.config.ts to support a VITE_BASE_URL env var for correct asset paths when deployed to a subdirectory.
The GITHUB_TOKEN is read-only for PRs from forks, so the deploy action gets a 403 when trying to push to gh-pages. Switch to pull_request_target which runs in the base repo context with write permissions. Explicitly checkout the PR head SHA to build the correct code.
pull_request_target only works if the workflow file already exists on the base branch — since this is a new workflow, GitHub can't discover it with pull_request_target. Revert to pull_request trigger. The 403 permission error requires a one-time repo settings change: Settings → Actions → General → Workflow permissions → Read and write
GitHub always restricts GITHUB_TOKEN to read-only for the upstream repo on fork PRs, even with 'Read and write' workflow permissions. pull_request_target runs in the base repo context with write access. Note: this PR itself won't trigger a preview because pull_request_target reads the workflow file from the base branch — it won't exist on main until after merging. All subsequent PRs will get previews automatically.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
What
Every pull request now gets a live preview deployed to GitHub Pages at a URL like:
Previews are automatically updated on each push and removed when the PR is closed.
How it works
New workflow
.github/workflows/pr-preview.yml— triggers on PR open/sync/close, builds the site with a subdirectorybasepath, and deploys to thegh-pagesbranch underpr-preview/pr-N/using rossjrw/pr-preview-actionUpdated workflow
.github/workflows/deploy-pages.yml— switched from the GitHub Pages API (deploy-pagesaction) to thegh-pagesbranch approach (peaceiris/actions-gh-pages) so both the main site and PR previews coexist on the same branch. Useskeep_dirs: pr-previewto avoid wiping active previews on main deploys.Updated
vite.config.ts— readsVITE_BASE_URLenv var to set<base href>correctly when deployed to a subdirectory (e.g./pr-preview/pr-15/)Setup required
After merging, GitHub Pages needs to be configured to serve from the
gh-pagesbranch (root):gh-pagesbranch,/ (root)directoryThe first deploy will create the
gh-pagesbranch automatically.Files changed
.github/workflows/pr-preview.yml— new PR preview workflow.github/workflows/deploy-pages.yml— switch to gh-pages branch deploymentvite.config.ts— supportVITE_BASE_URLfor subdirectory deploys