关于javascript:一篇教你代码同步-Github-和-Gitee

8次阅读

共计 3278 个字符,预计需要花费 9 分钟才能阅读完成。

前言

在上篇《一篇带你用 VuePress + Github Pages 搭建博客》,咱们胜利的用 VuePress 搭建了博客并部署到 Github Pages,但因为 Github 的拜访问题,咱们能够抉择把仓库部署到 Gitee 一份,利用 Gitee 的 Pages 服务再生成一份动态网站用于备用。

Gitee 导入仓库

上篇咱们曾经在 Github 创立了博客仓库,当初咱们在 Gitee 绑定 Github 账号后,抉择仓库导入:

仓库建设后,问题也来了,即咱们一份本地仓库,如何保障 Github 和 Gitee 仓库代码的同步呢?

1. 手动同步

在 Gitee 的我的项目主页,提供了同步的按钮,你只用点一下,即可与 Github 同步更新,然而留神这里的同步性能默认是强制同步。

有点麻烦的是,咱们须要在推送到 Github 后,再到 Gitee 我的项目主页手动点击一下。

2. 推送两个仓库

除此之外,咱们也能够在 sh 脚本文件里,间接推送到两个仓库地址上,咱们批改一下上篇的脚本:

#!/usr/bin/env sh

# 确保脚本抛出遇到的谬误
set -e

# 生成动态文件
npm run docs:build

# 进入生成的文件夹
cd docs/.vuepress/dist

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

# 如果公布到 https://<USERNAME>.github.io/<REPO>
git push -f git@github.com:mqyqingfeng/learn-typescript.git master:gh-pages
git push -f git@gitee.com:mqyqingfeng/learn-typescript.git master:gh-pages

cd -

当咱们执行 sh deploy.sh 的时候,就会主动往两个仓库里推送。

3. Github Actions 主动同步

咱们也能够利用 Github Actions,写一个工作流,在发现 Github 博客仓库的 gh-pages 分支代码更新后,主动同步以后代码到 Gitee 上。

对于 Github Actions 的介绍,能够参考阮一峰老师的《GitHub Actions 入门教程》。

为了实现 Gitee 和 Github 的同步,咱们须要借助一个 action,还好业界曾经有现成的实现了,这里我采纳的是 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,所以这里我应该改成 github/mqyqingfeng
  • dst 示意须要同步到的目标端账户名,即咱们 Gitee 的账户名,因为我的 Gitee ID 也是 mqyqingfeng,所以这里我应该改成 gitee/mqyqingfeng
  • dst_key 示意用于在目标端上传代码的私钥,而后将其保留在 Secrets 中。

具体的操作步骤如下:

获取私钥:

cat ~/.ssh/id_rsa

复制私钥内容,而后在要同步的 Github 仓库中,抉择 “Setting” -> “Secrets” -> “New repository secret”

填入 Secret 内容,Name 命名为 “GITEE_PRIVATE_KEY”,Value 为复制的内容 [
](https://lovelijunyi.gitee.io/…)

而后点击 Add secret 即可。

  • dst_token 创立仓库的 API tokens,用于主动创立不存在的仓库。这里咱们从 Gitee 上获取,具体地址为 https://gitee.com/profile/personal_access_tokens。生成并复制 Token,而后同样的步骤,保留在 Github 的 Secrets 中,Name 为 “GITEE_TOKEN”

那么咱们就能够在仓库建设的根目录下,建设目录 .github/workflows,而后创立一个名为 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_updatetrue 示意启用 git push -f 强制同步,debugtrue 示意启用 debug 开关,会显示所有执行命令。

当咱们把这样的文件提交到 Github,Github 会自动检测并运行该脚本。然而当初还有几个问题要留神:

  1. 因为咱们是提交到 Github 的 gh-pages 分支上,这个文件和目录须要写在 gh-pages 分支
  2. 察看咱们的脚本代码,咱们就会发现,每次咱们 sh deploy.sh 的时候,都是编译代码到 dist 目录,而后从新 git init,最初强制提交。所以咱们在我的项目的根目录建设 .github/woorkflows/syncToGitee.yml 并没有什么用,一来提交的是 dist 目录里的代码,二是每次还都会清空从新编译生成代码提交。

为此,咱们能够在脚本里增加代码,每次编译完后,再拷贝外层的 .github/woorkflows/syncToGitee.yml 到 dist 目录里,再提交到 Github 上。

所以咱们仍然在我的项目根目录增加目录和文件,此时的文件构造如下:

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

脚本文件代码如下:

#!/usr/bin/env sh

# 确保脚本抛出遇到的谬误
set -e

# 生成动态文件
npm run docs:build

# 进入生成的文件夹
cd docs/.vuepress/dist

# 拷贝目录和文件
cp -r ../../../.github ./

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

# 如果公布到 https://<USERNAME>.github.io/<REPO>
git push -f git@github.com:mqyqingfeng/learn-typescript.git master:gh-pages

cd -

此时咱们再运行 sh deploy.sh 代码提交到 Github,就能够在仓库的 Actions 中看到运行记录:

执行工夫大略一分钟左右,Gitee 的代码就会主动同步。

至此,咱们实现了 Github 与 Gitee 代码仓库的同步。

系列文章

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

微信:「mqyqingfeng」,加我进冴羽惟一的读者群。

如果有谬误或者不谨严的中央,请务必给予斧正,非常感激。如果喜爱或者 有所启发,欢送 star,对作者也是一种激励。

正文完
 0