一篇教你代碼同步 GitHub 和 Gitee

前言

在上篇《一篇帶你用 VuePress + Github Pages 搭建博客》，我們成功的用 VuePress 搭建了博客并部署到 Github Pages，但由于 Github 的訪問問題，我們可以選擇把倉庫部署到 Gitee 一份，利用 Gitee 的 Pages 服務(wù)再生成一份靜態(tài)網(wǎng)站用于備用。

Gitee 導(dǎo)入倉庫

上篇我們已經(jīng)在 Github 創(chuàng)建了博客倉庫，現(xiàn)在我們在 Gitee 綁定 Github 賬號后，選擇倉庫導(dǎo)入：

倉庫建立后，問題也來了，即我們一份本地倉庫，如何保證 Github 和 Gitee 倉庫代碼的同步呢？

1. 手動同步

在 Gitee 的項目主頁，提供了同步的按鈕，你只用點一下，即可與 Github 同步更新，但是注意這里的同步功能默認(rèn)是強(qiáng)制同步。

有點麻煩的是，我們需要在推送到 Github 后，再到 Gitee 項目主頁手動點擊一下。

2. 推送兩個倉庫

除此之外，我們也可以在 sh 腳本文件里，直接推送到兩個倉庫地址上，我們修改一下上篇的腳本：

#!/usr/bin/env?sh

#?確保腳本拋出遇到的錯誤
set?-e

#?生成靜態(tài)文件
npm?run?docs:build

#?進(jìn)入生成的文件夾
cd?docs/.vuepress/dist

git?init
git?add?-A
git?commit?-m?'deploy'

#?如果發(fā)布到?https://.github.io/
[email protected]:mqyqingfeng/learn-typescript.git?master:gh-pages
[email protected]:mqyqingfeng/learn-typescript.git?master:gh-pages

cd?-

當(dāng)我們執(zhí)行 sh deploy.sh 的時候，就會自動往兩個倉庫里推送。

3. Github Actions 自動同步

我們也可以利用 Github Actions，寫一個工作流，在發(fā)現(xiàn) Github 博客倉庫的 gh-pages 分支代碼更新后，自動同步當(dāng)前代碼到 Gitee 上。

關(guān)于 Github Actions 的介紹，可以參考阮一峰老師的 《GitHub Actions 入門教程》。

為了實現(xiàn) Gitee 和 Github 的同步，我們需要借助一個 action，還好業(yè)界已經(jīng)有現(xiàn)成的實現(xiàn)了，這里我采用的是 Hub Mirror Action，我們可以看到使用的示例代碼：

steps:
-?name:?Mirror?the?Github?organization?repos?to?Gitee.
??uses:?Yikun/hub-mirror-action@master
??with:
????src:?github/kunpengcompute
????dst:?gitee/kunpengcompute
????dst_key:?${{?secrets.GITEE_PRIVATE_KEY?}}
????dst_token:?${{?secrets.GITEE_TOKEN?}}
????account_type:?org

其中有四個必填項：

• src 表示需要被同步的源端賬戶名，即我們 Github 的賬戶名，因為我的 Github ID 是 mqyqingfeng，所以這里我應(yīng)該改成 github/mqyqingfeng。
• dst 表示需要同步到的目的端賬戶名，即我們 Gitee 的賬戶名，因為我的 Gitee ID 也是 mqyqingfeng，所以這里我應(yīng)該改成 gitee/mqyqingfeng。
• dst_key 表示用于在目的端上傳代碼的私鑰，然后將其保存在 Secrets 中。

具體的操作步驟如下：

獲取私鑰：

cat?~/.ssh/id_rsa

復(fù)制私鑰內(nèi)容，然后在要同步的 Github 倉庫中，選擇 "Setting" -> "Secrets" -> "New repository secret"

填入 Secret 內(nèi)容，Name 命名為 "GITEE_PRIVATE_KEY"，Value 為復(fù)制的內(nèi)容

然后點擊 Add secret 即可。

• dst_token 創(chuàng)建倉庫的API tokens， 用于自動創(chuàng)建不存在的倉庫。這里我們從 Gitee 上獲取，具體地址為 https://gitee.com/profile/personal_access_tokens。生成并復(fù)制 Token，然后同樣的步驟，保存在 Github 的 Secrets 中，Name 為 "GITEE_TOKEN"

那么我們就可以在倉庫建立的根目錄下，建立目錄 .github/workflows ，然后創(chuàng)建一個名為syncToGitee.yml 的文件：

name:?syncToGitee
on:
??push:
????branches:
??????-?gh-pages
jobs:
??repo-sync:
????runs-on:?ubuntu-latest
????steps:
??????-?name:?Mirror?the?Github?organization?repos?to?Gitee.
????????uses:?Yikun/hub-mirror-action@master
????????with:
??????????src:?'github/mqyqingfeng'
??????????dst:?'gitee/mqyqingfeng'
??????????dst_key:?${{?secrets.GITEE_PRIVATE_KEY?}}
??????????dst_token:??${{?secrets.GITEE_TOKEN?}}
??????????static_list:?"learn-typescript"
??????????force_update:?true
???????debug:?true

其中，static_list 表示單一倉庫同步，force_update 為 true 表示啟用 git push -f 強(qiáng)制同步，debug 為 true 表示啟用 debug 開關(guān)，會顯示所有執(zhí)行命令。

當(dāng)我們把這樣的文件提交到 Github，Github 會自動檢測并運(yùn)行該腳本。但是現(xiàn)在還有幾個問題要注意：

1. 因為我們是提交到 Github 的 gh-pages 分支上，這個文件和目錄需要寫在 gh-pages 分支
2. 觀察我們的腳本代碼，我們就會發(fā)現(xiàn)，每次我們 sh deploy.sh 的時候，都是編譯代碼到 dist 目錄，然后重新 git init ，最后強(qiáng)制提交。所以我們在項目的根目錄建立 .github/woorkflows/syncToGitee.yml 并沒有什么用，一來提交的是 dist 目錄里的代碼，二是每次還都會清空重新編譯生成代碼提交。

為此，我們可以在腳本里添加代碼，每次編譯完后，再拷貝外層的 .github/woorkflows/syncToGitee.yml 到 dist 目錄里，再提交到 Github 上。

所以我們依然在項目根目錄添加目錄和文件，此時的文件結(jié)構(gòu)如下：

.
├─?docs
│??├─?README.md
│??└─?.vuepress
│?????└─?config.js
└─?.github
│??└─?workflows
│???└─?syncToGitee.yml
└─?package.json
└─?deploy.sh

腳本文件代碼如下：

#!/usr/bin/env?sh

#?確保腳本拋出遇到的錯誤
set?-e

#?生成靜態(tài)文件
npm?run?docs:build

#?進(jìn)入生成的文件夾
cd?docs/.vuepress/dist

#?拷貝目錄和文件
cp?-r?../../../.github?./

git?init
git?add?-A
git?commit?-m?'deploy'

#?如果發(fā)布到?https://.github.io/
[email protected]:mqyqingfeng/learn-typescript.git?master:gh-pages

cd?-

此時我們再運(yùn)行 sh deploy.sh 代碼提交到 Github，就可以在倉庫的 Actions 中看到運(yùn)行記錄：

執(zhí)行時間大概一分鐘左右，Gitee 的代碼就會自動同步。

至此，我們實現(xiàn)了 Github 與 Gitee 代碼倉庫的同步。

系列文章

系列文章目錄地址：https://github.com/mqyqingfeng/Blog