一、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配置信息: