nuxt.com
nuxt.com copied to clipboard
PNPM Deployment to GitHub Pages
The current example deployment script generates warnings due to the actions using deprecated versions.
I also use pnpm
locally, so an example of how to get started with pnpm
as well as npm
would be nice.
I'm not sure what the preset does in npx nuxt build --preset github_pages
and if that's the same as the Nitro preset?
My own static page could be deployed using pnpm generate
with this deploy.yaml
script:
# https://github.com/actions/deploy-pages#usage
name: Deploy to GitHub Pages
on:
push:
branches: [main]
workflow_dispatch:
# Grant GITHUB_TOKEN the permissions required to make a Pages deployment
permissions:
contents: read
pages: write # to deploy to Pages
id-token: write # to verify the deployment originates from an appropriate source
jobs:
build:
runs-on: ubuntu-latest
steps:
- name: Checkout
uses: actions/checkout@v4
- name: Setup PNPM
uses: pnpm/action-setup@v3
with:
version: 9.0.x
- name: Setup Node
uses: actions/setup-node@v4
with:
node-version: "20"
# Pick your own package manager and build script
- name: Install dependencies
run: pnpm install
- name: Build nuxt
run: pnpm generate
- name: Upload artifact
uses: actions/upload-pages-artifact@v3
with:
path: ./.output/public
# Deployment job
deploy:
environment:
name: github_pages
url: ${{ steps.deployment.outputs.page_url }}
needs: build
runs-on: ubuntu-latest
steps:
- name: Deploy to GitHub Pages
id: deployment
uses: actions/deploy-pages@v4
I'm hesitant to update the docs with this example myself when I don't fully understand it all yet, but maybe this could be useful as a starter to someone with more knowledge then me (or future me).
I took some inspiration from the Vitepress example, which is why a couple of things have been moved or reformatted slightly.
Edit: remove - run: corepack enable
as I don't think its necessary.