GithubAction的使用-简单易懂

一、Github Action简介

github Action （工作流），简单理解就是自动化部署、测试。也就是之前人工手动部署变为现在由机器（服务器）自动部署、测试了。

二、对github Action（工作流）的使用

首先需要有个人令牌，
教程：github个人令牌生成

将令牌配置到仓库


点击Actions

创建秘钥

配置秘钥
下图秘钥是配置个人令牌，这就是上面教程生成的个人令牌

效果如下：

它们之间的关联

github action工作流配置

name: docs

on:
  # 每当 push 到 main 分支时触发部署
  push:
    branches: 
      - develop
  # 手动触发部署
  workflow_dispatch:

jobs:
  docs:
    runs-on: ubuntu-latest

    steps:
      - uses: actions/checkout@v2
        with:
          # “最近更新时间” 等 git 日志相关信息，需要拉取全部提交记录
          fetch-depth: 0

      - name: Setup Node.js
        uses: actions/setup-node@v1
        with:
          # 选择要使用的 node 版本
          node-version: '16'

      # 缓存 node_modules
      - name: Cache dependencies
        uses: actions/cache@v2
        id: yarn-cache
        with:
          path: |
            **/node_modules
          key: ${{ runner.os }}-yarn-${{ hashFiles('**/yarn.lock') }}
          restore-keys: |
            ${{ runner.os }}-yarn-

      # 如果缓存没有命中，安装依赖
      - name: Install dependencies
        if: steps.yarn-cache.outputs.cache-hit != 'true'
        run: yarn --frozen-lockfile

      # 运行构建脚本
      - name: Build VuePress site
        run: yarn docs:build

      # 查看 workflow 的文档来获取更多信息
      # @see https://github.com/crazy-max/ghaction-github-pages
      - name: Deploy to GitHub Pages
        uses: crazy-max/ghaction-github-pages@v2
        with:
          # 将要部署资产的 GitHub 存储库（默认$GITHUB_REPOSITORY）
          repo: 用户名/仓库名
          # 部署到 gh-pages 分支
          target_branch: gh-pages
          # 部署目录为 VuePress 的默认输出目录
          build_dir: dist
        env:
          # @see https://docs.github.com/cn/actions/reference/authentication-in-a-workflow#about-the-github_token-secret
          GITHUB_TOKEN: ${{ secrets.PRESS_TOKEN }}

比如创建了一个仓库abc，用户名为xiaoli

你想使用github action 工作流，在同一个用户下，从abc仓库中构建的代码部署到自己新建的 defg 仓库中，
此时你就可以看看下图：

该配置和源代码在abc仓库中，运行在工作流就会将该仓库构建好的静态资源部署到defg仓库中。
同样你想将github代码部署到gitee仓库中，则使用下面的配置：

jobs:
  build:
    runs-on: ubuntu-latest
    steps:
      - name: Sync to Gitee
        uses: wearerequired/git-mirror-action@master
        env:
          # 在 Settings->Secrets
          SSH_PRIVATE_KEY: ${{ secrets.GITEE_PRIVATE_KEY }}
        with:
          # GitHub 源仓库地址
          source-repo: git@github.com:xiaoli/abc.git
          # Gitee 目标仓库地址
          destination-repo: git@gitee.com:xiaoli/defg.git

      # - name: Build Gitee Pages # 部署 gitee pages 因为已经部署了github所以就没必要了
      #   uses: yanglbme/gitee-pages-action@master
      #   with:
      #     # 注意替换为你的 Gitee 用户名
      #     gitee-username: huangwantong
      #     # 注意在 Settings->Secrets 配置 GITEE_PASSWORD
      #     gitee-password: ${{ secrets.GITEE_PASSWORD }}
      #     # 注意替换为你的 Gitee 仓库
      #     gitee-repo: vue3-vite-vant-h5-template
      #     branch: gh-pages

如果是在abc仓库下执行下图文件，就使用下面的方式就可以了

name: Deploy Docs

on:
  push:
    branches:
      - main

jobs:
  deploy-gh-pages:
    runs-on: ubuntu-latest
    steps:
      - name: Checkout
        uses: actions/checkout@v3
        with:
          fetch-depth: 0
          # if your docs needs submodules, uncomment the following line
          # submodules: true


      - name: Install pnpm
        uses: pnpm/action-setup@v2
        with:
          version: 7
          run_install: true


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

      - name: Install Deps
        run: pnpm install --frozen-lockfile

      - name: Build Docs
        env:
          NODE_OPTIONS: --max_old_space_size=8192
        run: |-
          pnpm run docs:build
          > docs/.vuepress/dist/.nojekyll

      - name: Deploy Docs
        uses: JamesIves/github-pages-deploy-action@v4
        with:
          branch: gh-pages
          folder: dist

总结

总之，学习使用工作流，查找过很多资料、看官方文档，入了个门，会使用一些部署方式，这也是自己多次的尝试才有了现在的结果。

附件

官方文档github action配置：https://github.com/crazy-max/ghaction-github-pages
github创建个人令牌：https://docs.github.com/cn/authentication/keeping-your-account-and-data-secure/creating-a-personal-access-token

记录with配置信息：