个人网站建设规划实践报告,网站开发包含网站维护吗,响应式网站排名如何,六安官网使用github的action自动部署到github-pages中
创建部署的deploy.yml文件#xff0c;在项目的根目录下面
.github\workflows\deploy.yml 完整的代码#xff1a;使用的是pnpm进行依赖安装。
name: 部署VitePresson:push:branches:- docs # 这段是在推送到 docs 分支时触发该…使用github的action自动部署到github-pages中
创建部署的deploy.yml文件在项目的根目录下面
.github\workflows\deploy.yml 完整的代码使用的是pnpm进行依赖安装。
name: 部署VitePresson:push:branches:- docs # 这段是在推送到 docs 分支时触发该命令jobs:build-and-deploy:runs-on: ubuntu-lateststeps:- name: Checkout codeuses: actions/checkoutv2with:ref: docs # 这一步检查 docs 代码- name: Setup Node.js and pnpmuses: actions/setup-nodev3with:node-version: 20.10.0 # 设置 nodejs 的版本- name: Install pnpmrun: npm install -g pnpm # 全局安装 pnpm- name: Install dependenciesrun: pnpm install # 使用 pnpm 安装依赖- name: Build VitePressrun: pnpm run docs:build # 这里是打包 vitepress 命令- name: Deploy to GitHub Pagesuses: peaceiris/actions-gh-pagesv3with:github_token: ${{ secrets.PAT_TOKEN }} # 这一步很重要单独看下面的大步骤主要是用来给该脚本一些仓库权限publish_dir: .vitepress/dist # 指定该文件夹中的 dist publish_branch: gh-pages # 推送到关联仓库的 gh-pages 分支dotfiles: true # 包括在提交中即使被 .gitignore 文件忽略这段 YAML 文件定义了一个 GitHub Actions 工作流用于在推送到 docs 分支时构建和部署 VitePress 项目。 on: 定义触发工作流的事件这里是在推送到 docs 分支时触发。 jobs: 定义工作流中的任务。 build-and-deploy: 任务的名称表示构建和部署。 runs-on: 指定任务运行的操作系统这里是 ubuntu-latest。 steps: 定义任务的一系列步骤。 name: 步骤的名称。 uses: 使用的 GitHub Action。 with: 配置项用于传递参数给 Action。 run: 执行的脚本命令。
其中具体步骤解释如下 检出代码使用 actions/checkout Action 将代码检出到工作目录。 设置 Node.js 和 pnpm使用 actions/setup-node Action 设置 Node.js 和安装 pnpm。 安装 pnpm全局安装 pnpm。 安装依赖使用 pnpm 安装项目依赖。 构建 VitePress运行 pnpm 命令构建 VitePress 项目。 部署到 GitHub Pages使用 peaceiris/actions-gh-pages Action 部署生成的静态文件到 GitHub Pages。配置中包括 GitHub Token、发布目录、发布分支以及是否包括 dotfiles即使在 .gitignore 中也提交等。
仓库说明 以下创建私人token和pages详细的步骤截图 如果看不清楚可以右键打开到新窗口预览 github_token: ${{ secrets.PAT_TOKEN }}创建 先点击个人头像进入设置页面 进入 Developer Settings 设置 生成个人token Personal access tokens (classic) 设置token 保存生成的token 进入仓库添加该仓库的token
4. 创建githubpages
