Skip to main content

部署问题记录

问题 1: Vercel 部署权限错误​

Error: Git author 15564773+difyz@user.noreply.gitee.com must have access 
to the team le_pencil's projects on Vercel to create deployments.

原因: Git 配置使用的是 Gitee 邮箱，与 Vercel 团队账户不匹配。

解决方案: 更新 Git 配置为 GitHub 邮箱。

执行步骤:

# 1. 查看当前 Git 配置
git config user.email
# 输出: 15564773+difyz@user.noreply.gitee.com

# 2. 更新为 GitHub 邮箱
git config user.email "difyz.com@gmail.com"

# 3. 修正最近的提交
git commit --amend --author="difyz <difyz.com@gmail.com>" --no-edit

# 4. 强制推送到 GitHub
git push --force origin main

# 5. 删除 Vercel 团队链接
rm -rf .vercel

# 6. 重新部署
vercel --prod

🚀 Vercel 自动部署配置​

配置文件​

1. vercel.json​

{
  "buildCommand": "npm run build",
  "outputDirectory": "build",
  "devCommand": "npm start",
  "installCommand": "npm install"
}

2. 部署脚本 deploy.sh​

#!/bin/bash

echo "🚀 开始部署到 Vercel..."

# 检查是否已登录
if ! vercel whoami &> /dev/null; then
    echo "📝 请先登录 Vercel..."
    vercel login
fi

# 构建项目
echo "🔨 构建项目..."
npm run build

if [ $? -ne 0 ]; then
    echo "❌ 构建失败！"
    exit 1
fi

echo "✅ 构建成功！"

# 部署到 Vercel
echo "📤 部署到 Vercel..."
vercel --prod

if [ $? -eq 0 ]; then
    echo "✅ 部署成功！"
    echo "🎉 你的网站已经上线了！"
else
    echo "❌ 部署失败！"
    exit 1
fi

赋予执行权限:

chmod +x deploy.sh

通过 Vercel 网站设置自动部署​

步骤 1: 登录 Vercel​

  1. 访问 https://vercel.com
  2. 使用 GitHub 账号登录

步骤 2: 导入项目​

  1. 点击 "Add New..." → "Project"
  2. 选择 difyz9/blog-site 仓库
  3. 点击 "Import"

步骤 3: 配置项目​

Vercel 自动检测 Docusaurus 项目，默认配置：

  • Framework Preset: Other
  • Build Command: npm run build
  • Output Directory: build
  • Install Command: npm install

步骤 4: 部署​

点击 "Deploy" 按钮，等待构建完成。

步骤 5: 自动部署已启用 ✅​

  • ✅ 推送到 main 分支 → 自动生产部署
  • ✅ 创建 Pull Request → 自动预览部署
  • ✅ 每个提交都会触发新的部署

通过 Vercel CLI 部署​

安装 Vercel CLI​

npm i -g vercel

登录​

vercel login

首次部署​

# 在项目根目录运行
vercel

# 回答问题：
# ? Set up and deploy "~/path/to/blog-site"? Y
# ? Which scope should contain your project? <选择个人账户>
# ? Link to existing project? N
# ? What's your project's name? blog-site
# ? In which directory is your code located? ./

部署到生产环境​

vercel --prod

✅ 验证清单​

构建验证​

# 本地构建测试
npm run build

# 应该看到：
# ✔ Client - Compiled successfully
# ✔ Server
# [SUCCESS] Generated static files in "build".

Git 配置验证​

# 检查邮箱配置
git config user.email
# 应该输出: difyz.com@gmail.com

# 检查最近提交
git log -1 --pretty=format:"%an <%ae>"
# 应该输出: difyz <difyz.com@gmail.com>

Vercel 部署验证​

# 检查部署状态
vercel ls

# 查看项目信息
vercel inspect

📝 关键命令总结​

日常开发流程​

# 1. 修改代码
# 编辑文件...

# 2. 本地测试
npm run build  # 构建测试
npm start      # 本地预览

# 3. 提交代码
git add .
git commit -m "更新内容"
git push origin main

# 4. 自动部署
# Vercel 会自动检测推送并部署，无需手动操作

手动部署​

# 方式 1: 使用部署脚本
./deploy.sh

# 方式 2: 直接使用 Vercel CLI
vercel --prod

问题排查​

# 检查构建错误
npm run build

# 检查 Git 配置
git config --list

# 检查 Vercel 登录状态
vercel whoami

# 查看 Vercel 日志
vercel logs <deployment-url>

🎯 最佳实践​

Git 配置建议​

# 为不同平台的项目配置不同邮箱
# GitHub 项目
cd /path/to/github-project
git config user.email "your-github-email@gmail.com"

# Gitee 项目
cd /path/to/gitee-project
git config user.email "your-gitee-email@example.com"

部署前检查​

  • ✅ 本地构建成功
  • ✅ 没有断开的链接
  • ✅ 没有构建警告
  • ✅ Git 配置正确
  • ✅ 代码已推送到 GitHub

部署后验证​

  • ✅ 访问 Vercel 提供的 URL
  • ✅ 检查所有页面是否正常
  • ✅ 测试导航和链接
  • ✅ 验证样式和功能

🔗 相关链接​

📊 问题解决时间线​

  1. ✅ 移除 PaidContent 组件依赖
  2. ✅ 修复断开的 CONFIG.md 链接
  3. ✅ 修复中文锚点链接
  4. ✅ 解决 Git 邮箱配置问题
  5. ✅ 成功部署到 Vercel
  6. ✅ 启用自动部署

最终结果: 🎉 项目成功部署到 Vercel，并启用了 Git 自动部署功能！

每次推送到 main 分支，Vercel 会自动触发构建和部署。