前提

申请GitHub Token

申请地址: Personal access tokens,权限不懂配可以全打勾

配置好deploy

参考:最方便的 Hexo 部署

1
hexo cl && hexo g && hexo d

https://github.com/weilining/weilining.github.io

测试以上代码看是否能提交到yourname.github.io

GitHub创建博客源码仓库

比如我的博客空仓库blog,设置私有

地址:https://github.com/weilining/blog

自己测试能否访问

开始

进入博客根目录

进入到你的博客源文件根目录

1
2
3
cd hexo
ls
scaffolds source themes _config.yml package.json

运行代码

在博客源文件根目录运行下面代码,自动创建.github/workflows/HexoWorkFlows.yml

1
mkdir -p .github/workflows && wget https://gitee.com/weilining/quick-hexo-next/raw/master/.github/workflows/HexoWorkFlows.yml -O .github/workflows/HexoWorkFlows.yml

提交到GitHub

在博客根目录运行以下代码,提交到GitHub

1
2
3
4
5
6
find . -name ".git" | xargs rm -Rf
git init
git add .
git commit -m "first commit"
git remote add origin git@github.com:GitHub 用户名/blog.git
git push -f origin master

ENJOY

基础

建立Git仓库

首先建立一个Git仓库,这里不再赘述

创建sshkey

这里我采用了sshkey的形式来进行仓库的操作

生成ssh密钥

1
ssh-keygen -t rsa -C YourCount@example.com

打开git仓库,添加部署用的私钥

setting->secrets->add new secret

添加权限验证的公钥

setting->deploy keys->add deploy key

至此我们的仓库准备工作就已经完成

编写action发布文件

action->set up a new workflow file

可以看到下方有很多发布模板供我们选择

此次我们自己来进行编写

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
name: auto publish #发布名称

on:
push: #触发方式
branches:
- master #触发分支

jobs: #脚本内容
build-deploy:
runs-on: ubuntu-latest

steps:
- uses: actions/checkout@v1
- run: npm ci
- run: npm install vuepress
- run: npm run build
- run: cp CNAME .vuepress/dist/ #指定gitpage的自定义域名

- name: Deploy
uses: peaceiris/actions-gh-pages@v2.5.0
env:
ACTIONS_DEPLOY_KEY: ${{secrets.publish}} #这里引用的是刚才生成的私钥
PUBLISH_BRANCH: gh-pages #发布到的分支
PUBLISH_DIR: .vuepress/dist #需要发布的内容

至此就算结束了

下面我们每次对master分支的推送都会触发该发布流程

该发布流程会自动构建vuepress项目并把生成的文件发布到当前项目的gh-pages分支下

这样我们就可以专心写代码了

进阶

自动构建后发布到不同的仓库

我们直接新建一个yml发布文件

在系统给我们生成的文件中我们可以看到基础语法的介绍

这里我结合自己的理解标注一下

在进行解读之前我们先了解一下基本概念

基本术语

  • workflow (工作流程)
  • job (任务) 一个workflow可以由多个不同的job组成
  • step (步骤) 每个job可以由多个step来组成
  • action(动作) 每个step又可以由多个action来组成

Action市场

由于持续集成大家的需求大部分可能都是相同的操作

所以github建立了一个Action市场

使得每个人编写的Action脚本都可以被其他人来引用

这就使得当我这种彩笔小白想要使用这些功能的时候而不用写出很复杂的脚本

而这整个持续集成的过程也就成为了不同的Action相组合的产物

使用方法也很简单,只需要使用uses关键字直接引用别人的库即可

1
uses userName/repoName

结合模板

然后我们来结合系统生成的基础模板来进行基本的解读

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
# This is a basic workflow to help you get started with Actions

name: CI # 构建流程的名称


on: #触发该流程的方式
push:
branches: [ master ] #触犯该流程的分支
pull_request:
branches: [ master ]

jobs:
# 该任务当前仅包含了一个任务 名称是build
build:
runs-on: ubuntu-latest #任务锁运行的工作环境

# 该任务所包含的步骤
steps:
# 步骤所依赖的操作库 这里引用了官方发布的git操作库 目的是拉取当前库的代码
- uses: actions/checkout@v2

# 这里是一个单行命令的模板
- name: Run a one-line script
run: echo Hello, world!

# 这里是一个多行命令的模板
- name: Run a multi-line script
run: |
echo Add other actions to build,
echo test, and deploy your project.

使用已有的库进行持续集成(当前库构建发布到另外的库)

到这里我们就可以开始进行自己的Action的组装了

首先我们先找一个有发布到其他Git库功能的Action

我们可以在github的市场搜索自己需要的Action

这里我使用的是s0/git-publish-subdir-action@master

点开这个库的主页我们可以在下方看到该库的使用说明

这里就不在赘述了

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
name: AutoBuild

on:
push:
branches: [ OneKeyVip-master ]
pull_request:
branches: [ OneKeyVip-master ]
jobs:

build:
name: build
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v2
- name: npm install
run: |
npm install
npm ci
- name: npm build
run: |
npm run build
cp README.MD ./publish/README.MD
cp CHANGELOG ./publish/CHANGELOG

- name: publish
uses: s0/git-publish-subdir-action@master
env:
REPO: 目标库
BRANCH: 目标分支
FOLDER: 要发布的内容所在的文件夹
SSH_PRIVATE_KEY: ${{ secrets.publish }}

结语

至此我们就完成了从当前库发布到其他的库持续集成的脚本的编写

剩下的我们就可以不再关心代码的生成与发布了

可以愉快的码代码了

缓存nodo_modules

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
name: 自動部署 Hexo

on:
push:
branches:
- master

jobs:
build:
runs-on: ubuntu-latest
strategy:
matrix:
node-version: [10.x]

steps:
- name:
uses: actions/checkout@v1

- name: Step Node.js ${{ matrix.node-version }}
uses: actions/setup-node@v1
with:
node-version: ${{ matrix.node-version }}

- name: Install Hexo CI
run: |
export TZ='Asia/Shanghai'
npm install hexo-cli -g

- name: Cache
uses: actions/cache@v1
id: cache-dependencies
with:
path: node_modules
key: ${{runner.OS}}-${{hashFiles('**/package-lock.json')}}

- name: Install plugins
if: steps.cache-dependencies.outputs.cache-hit != 'true'
run: |
npm install

- name: Deploy
run: |
hexo clean && hexo g && hexo douban && gulp
cd ./public
git init
git config user.name "${{secrets.GIT_NAME}}"
git config user.email "${{secrets.GIT_EMAIL}}"
git add .
git commit -m "Update"
git push --force --quiet "https://${{secrets.GH_TOKEN}}@${{secrets.GH_REF}}" master:master
git push --force --quiet "https://${{secrets.CD_TOKEN}}@${{secrets.CD_REF}}" master:master

Hugo 通过 Github Action 部署到 GitHub Pages

A仓库放Hugo源码,B仓库GitHub Pages

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
name: github pages

on:
push:
branches:
- main # Set a branch to deploy

jobs:
deploy:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v2
with:
submodules: true # Fetch Hugo themes (true OR recursive)
fetch-depth: 0 # Fetch all history for .GitInfo and .Lastmod

- name: Setup Hugo
uses: peaceiris/actions-hugo@v2
with:
hugo-version: 'latest'
# extended: true

- name: Build
run: hugo --minify

- name: Deploy
uses: peaceiris/actions-gh-pages@v3
with:
personal_token: ${{ secrets.PERSONAL_TOKEN }} #你的github令牌
publish_dir: ./public #需要部署的目录
CNAME: https://example.github.io/example.github.io #你的域名
external_repository: example/example.github.io #需要部署的存储库
INFO PublishBranch: gh-pages #需要部署的分知

参考

https://docs.github.com/en/actions