Hexo博客 Vercel 双向托管

将源码部署至 Vercel

从 Login – Vercel 登录你的 Vercel（推荐选择 Continue with Github，使用 Github 登录）
点击 dashboard 中的 addNew -> Project 即可新建一个 Vercel 项目。

选择从 GitHub 导入项目。

接下来选择 GitHub Pages 仓库的项目，点击 Import。

Vercel 会自动识别了这个仓库是一个 Hexo 项目，然后直接点击 Deploy 按钮部署。

见到以下界面即为成功，并点击 Continue to Dashboard。

在这里即可看到你的项目面板。

DOMAINS 下的链接就是 Vercel 给你当前项目分配的域名。

解析域名至 Vercel

依次点击 Settings -> Domains，在输入框内输入你项目要绑定的域名，然后点击 Add。

如果页面出现下方提示，则需要配置域名的 CNAME 记录解析至 vercel。

以我腾讯云域名配置为例的话，是这样的

配置完成后，会恢复正常。

GitHub Actions 添加 Vercel 自动部署

官方参考文档：examples/ci-cd/github-actions at main · vercel/examples · GitHub

创建 Vercel token

访问 Tokens – Account – Dashboard – Vercel，点击 Create。

接下来在弹窗内，TOKEN NAME 可以自行填写，其他的按照下图选择，配置好后点击 CREATE TOKEN。

创建好后会生成一个 token，将 token 记住，后续不会再展示了。

获取 Vercel projectId 和 orgId

在本地用 npm 安装 Vercel CLI。

1	npm i -g vercel

接下来运行 Vercel login 登录到 Vercel

1	vercel login

然后运行 vercel link 将本地环境绑定到你 Vercel 的仓库。

1	vercel Link

后面的流程按照下图走，最后一个问题输入你的 Vercel 仓库名

绑定成功后在本地路径找到 .vercel 文件夹，在文件夹内找到 project.json 文件，将文件内的 projectId 和 orgId 记住。

配置 GitHub Secrets

现在，在 GitHub 内配置三个 Secrets。

然后在你的 workflow 的 yml 文件内追加配置。

- name: Install Vercel CLI
  run: npm install --global vercel@canary
- name: Pull Vercel Environment Information
  run: vercel pull --yes --environment=production --token=${{ secrets.VERCEL_TOKEN }}
- name: Build Project Artifacts
  run: vercel build --prod --token=${{ secrets.VERCEL_TOKEN }}
- name: Deploy Project Artifacts to Vercel
  run: vercel deploy --prebuilt --prod --token=${{ secrets.VERCEL_TOKEN }}

并且在上方添加两个环境变量，然后将 node 的版本改为 14.x。

1
2
3

env:
  VERCEL_ORG_ID: ${{ secrets.VERCEL_ORG_ID }}
  VERCEL_PROJECT_ID: ${{ secrets.VERCEL_PROJECT_ID }}

node-version: '14.x'
然后保存修改，接下来 Vercel 双向托管就成功了。

更新博客内容

以后更新博客，只需要在语雀写好内容，Github 会自动部署到 GitHub Pages 和 Vercel。