本地写作 vercel 和vps双端同步自动更新

我的目标是，在本地写作博客，gush到github编译，编译完成后部署静态文件到vercel 和vps

GitHub Actions 中统一编译，并同时分发静态文件到 Vercel 和 VPS，你需要将 GitHub 变成“构建中心”。在这种配置下，Vercel 将作为生产环境，而 VPS（搭配 Caddy）作为备用环境或第二镜像。

第一步：VPS 环境准备 (Caddy)

VPS 环境准备 (Caddy)在VPS 上，需要一个目录来接收文件，以及 Caddy 的配置。创建存放目录：

1
2
3

sudo mkdir -p /var/www/bosh_blog
sudo chown -R $USER:$USER /var/www/bosh_blog

配置 Caddyfile：编辑 /etc/caddy/Caddyfile，指向你的 VPS 专用域名：

1
2
3
4
5
6

bosh.zz.ac {
    root * /var/www/bosh_vps
    file_server
    encode gzip
}

第二步：配置 GitHub Actions 工作流

在本地项目根目录创建 .github/workflows/deploy.yml。这个脚本会完成编译，并分别调用 Vercel 的官方 Action 和 SSH 传输工具。

 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
name: CI/CD Build and Deploy
on:
  push:
    branches:
      - main

jobs:
  build-and-deploy:
    runs-on: ubuntu-latest
    steps:
      - name: Checkout
        uses: actions/checkout@v4
        with:
          submodules: recursive

      - name: Setup Hugo
        uses: peaceiris/actions-hugo@v3
        with:
          hugo-version: '0.153.2'

      - name: Build
        run: hugo --gc --minify

      # ... 之前的 build 步骤 ...

      # 部署到 VPS (增加超时重试和端口显式指定)
      - name: Deploy to VPS
        uses: easingthemes/ssh-deploy@main
        env:
          SSH_PRIVATE_KEY: ${{ secrets.VPS_SSH_KEY }}
          REMOTE_HOST: ${{ secrets.VPS_HOST }}
          REMOTE_USER: ${{ secrets.VPS_USER }}
          REMOTE_PORT: 22  # 如果不是 22 请修改这里
          TARGET: /var/www/bosh_blog
          SOURCE: public/
          ARGS: "-avzr --delete"

      # 部署到 Vercel 
      - name: Deploy to Vercel
        uses: amondnet/vercel-action@v20
        with:
          vercel-token: ${{ secrets.VERCEL_TOKEN }}   
          vercel-org-id: ${{ secrets.VERCEL_ORG_ID }}     # 对应你在 Secrets 里的名字
          vercel-project-id: ${{ secrets.VERCEL_PROJECT_ID }} # 对应你在 Secrets 里的名字
          vercel-args: '--prod'
          working-directory: ./public

第三步：设置 GitHub Secrets (关键密钥)

你需要向 GitHub 仓库提交 5 个密钥（Settings > Secrets and variables > Actions）：

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
VPS 相关：
VPS_HOST: VPS 的 IP 地址。

VPS_USER: SSH 用户名（如 root）。

VPS_SSH_KEY: 你的 SSH 私钥 内容。

Vercel 相关：
VERCEL_TOKEN: 在 Vercel 令牌页面 创建。

VERCEL_ORG_ID 和 VERCEL_PROJECT_ID：

在本地安装 Vercel CLI：npm install -g vercel。

在项目根目录运行 vercel link。

完成后，在生成的 .vercel/project.json 文件中可以找到这两个 ID。

第四步：调整 Vercel 项目设置

由于我们已经在 GitHub Actions 里编译好了 public 目录，我们需要告诉 Vercel 不要再编译第二次：

将 Framework Preset 设置为 Other。

Build Command 开关打开，内容留空。

Output Directory 设置为 .（因为 GitHub Action 已经进入了 public 目录进行推送）。