- 仓库setting-pages-source选择Github Actions开启github pages
- 代码根目录创建.github-workflows-build.yml
- 推送代码
yml
# 1 工作流名称
name: CI
# 2 工作流执行名称
run-name: ${{ github.actor }} is update repo, start building...
# 3 触发器
on:
# push 推送
push:
branches: ['main']
# PR 合并提交
pull_request:
branches: ['main']
# 允许您从“操作”选项卡手动运行此工作流
workflow_dispatch:
# 4 设置权限(文件是可以被读写修改的)
permissions:
contents: write
pages: write
id-token: write
# 工作1
jobs:
# 任务名称
build:
# 执行平台
runs-on: ubuntu-latest
# 任务步骤
steps:
# 1 将代码仓库的内容拉取(或称为检出)到工作目录中,以便在下面的工作流程中使用
- name: Checkout code (检出代码)
uses: actions/checkout@v3
# 2 安装 node 环境,并设置版本为 16
- name: Setup Node.js (设置 node 版本)
uses: actions/setup-node@v3
with:
node-version: 18
# 3 安装 pnpm
- name: Install pnpm (安装 pnpm)
uses: pnpm/action-setup@v2
with:
version: 8.8.0
# 4 安装依赖
- name: Install dependencies (安装依赖)
run: pnpm install
# 5 代码检查,无该命令所以不执行
# - name: lint (代码检查)
# run: pnpm run lint
# 6 跑测试,无该命令所以不执行
# - name: Test (测试)
# run: pnpm run test
# 7 构建项目
- name: Build (构建)
run: pnpm run build
# 8 上传构建产物(actions/upload-artifact@v3 会上传工作流程中的文件)
- name: Upload build artifacts (上传构建产物)
uses: actions/upload-pages-artifact@v2
with:
path: './build'
# 9 部署 GitHub Pages
- name: Deploy to GitHub Pages(部署到 GitHub Pages)
uses: actions/deploy-pages@v2
with:
token: ${{ secrets.GITHUB_TOKEN }}
- https://github.com/zhangwh754/vue_preview_pages
- https://github.com/zhangwh754/vite-muti-page-app