GitHub Pages
将您的 Nuxt 应用程序部署到 GitHub Pages 基础设施。
Nuxt 支持部署到GitHub Pages只需少量配置。
GitHub Pages 只支持静态站点,Nuxt 会将您的应用程序预渲染为静态 HTML 文件。
如果您不使用自定义域,则需要将
NUXT_APP_BASE_URL 设置为您的构建步骤的存储库 slug。示例:https://<user>.github.io/<repository>/:NUXT_APP_BASE_URL=/<repository>/ npx nuxt build --preset github_pages设置
按照步骤创建 GitHub Pages 站点.
部署
以下是一个示例 GitHub Actions 工作流程,用于使用 github_pages 预设将您的站点部署到 GitHub Pages
.github/workflows/deploy.yml
# https://github.com/actions/deploy-pages#usage
name: Deploy to GitHub Pages
on:
workflow_dispatch:
push:
branches:
- main
jobs:
build:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v4
- run: corepack enable
- uses: actions/setup-node@v4
with:
node-version: "20"
# Pick your own package manager and build script
- run: npm install
- run: npx nuxt build --preset github_pages
- name: Upload artifact
uses: actions/upload-pages-artifact@v3
with:
path: ./.output/public
# Deployment job
deploy:
# Add a dependency to the build job
needs: build
# Grant GITHUB_TOKEN the permissions required to make a Pages deployment
permissions:
pages: write # to deploy to Pages
id-token: write # to verify the deployment originates from an appropriate source
# Deploy to the github_pages environment
environment:
name: github-pages
url: ${{ steps.deployment.outputs.page_url }}
# Specify runner + deployment step
runs-on: ubuntu-latest
steps:
- name: Deploy to GitHub Pages
id: deployment
uses: actions/deploy-pages@v4