您现在的位置是：首页 >技术杂谈 >github使用workflow工作流git push后自动打包部署github pages网站首页技术杂谈

workflows介绍

根目录新建.github/workflows/docs.yml

.github/workflows/ 目录是用于存放 GitHub Actions 工作流程文件的目录，该目录的文件名必须以 .yml 或 .yaml 为后缀名，否则 GitHub 将无法识别该文件为工作流程文件。这些工作流程文件可用于自动化执行项目中的各种任务，例如构建、测试、部署等。

工作流程文件是 GitHub Actions 的核心组成部分之一，可以帮助开发人员自动化执行各种任务，从而提高生产力、加速开发流程、提高代码质量等。

name: Docs

on:
  push:
    branches:
      - master
    paths:
      - src/**
  pull_request:
    paths:
      - src/**
  workflow_dispatch:
    branches:
      - master
    inputs:
      deploy:
        description: Deploy ?
        required: true
        default: false
        type: boolean

jobs:
  docs:
    name: Docs
    runs-on: ubuntu-latest
    steps:
      - name: Checkout
        uses: actions/checkout@v3

      - name: Setup Node.js
        uses: actions/setup-node@v3
        with:
          node-version: 18

      - name: Install pnpm
        id: pnpm-install
        uses: pnpm/action-setup@v2
        with:
          version: 7
          run_install: false

      - name: Get pnpm store
        id: pnpm-store
        shell: bash
        run: echo "STORE_PATH=$(pnpm store path)" >> $GITHUB_OUTPUT

      - name: Setup pnpm cache
        uses: actions/cache@v3
        with:
          path: ${{ steps.pnpm-store.outputs.STORE_PATH }}
          key: ${{ runner.os }}-pnpm-store-${{ hashFiles('**/pnpm-lock.yaml') }}
          restore-keys: ${{ runner.os }}-pnpm-store-

      - name: Install dependencies
        run: pnpm i --frozen-lockfile

      - name: Build docs
        run: pnpm run build

      - name: Deploy docs
        if: ${{ github.event_name == 'push' || inputs.deploy }}
        uses: peaceiris/actions-gh-pages@v3
        with:
          github_token: ${{ secrets.GITHUB_TOKEN }}
          publish_dir: dist

这是一个 GitHub Actions 的工作流程文件，用于在项目中自动化构建和发布文档。以下是文件中包含的主要部分：

name：定义工作流程名称为 “Docs”。

on：定义工作流程触发条件，包括在 master 分支上推送或合并 Pull Request 时构建，以及手动触发的工作流程。

jobs：定义工作流程中的工作。

docs：定义一个名为 “docs” 的工作，用于构建和发布文档。

runs-on：定义使用的操作系统为 ubuntu-latest。

steps：定义构成工作流程的一系列步骤。

Checkout：将代码检出到工作目录。

Setup Node.js：安装 Node.js 运行时环境。

Install pnpm：安装依赖管理工具 pnpm。

Get pnpm store：获取 pnpm 仓库路径并存储到环境变量 GITHUB_OUTPUT 中。

Setup pnpm cache：使用 GitHub Actions 缓存功能设置 pnpm 缓存。

Install dependencies：安装项目依赖。

Build docs：构建文档。

Deploy docs：发布文档到 GitHub Pages 上，前提是代码已经推送到 master 分支或手动触发工作流程，并且在输入参数中指定了 deploy=true。

uses：使用的 GitHub Actions 功能，包括代码检出、安装 Node.js、安装 pnpm、缓存、部署到 GitHub Pages 等。这些功能是通过 GitHub Actions Marketplace 中的 Action 进行实现的。

使用github pages

上方工作流，会创建一个gh-pages分支，选择该分支作为github pages使用的分支即可，以后只要更新src目录下的代码并git push推送，github就会自动打包部署项目到github pages上

工作流常见报错：工作流缺乏权限

如果没有写入权限的话，工作流是不能正常创建gh-pages分支