🚀 快速安装

复制以下命令并运行，立即安装此 Skill：

npx @anthropic-ai/skills install supercent-io/skills-template/vercel-deploy

💡 提示：需要 Node.js 和 NPM

Vercel 部署

立即将任何项目部署到 Vercel。无需认证。

何时使用此技能

  • 应用部署：当被问到“部署我的应用”时
  • 预览部署：当被问到“创建预览部署”时
  • 生产环境部署：当被问到“将此部署到生产环境”时
  • 分享链接：当被问到“部署并提供链接”时

工作原理

  1. 将您的项目打包成 tarball（排除 node_modules 和 .git）
  2. 从 package.json 自动检测框架
  3. 上传到部署服务
  4. 返回预览 URL（实时站点）和认领 URL（转移到您的 Vercel 账户）

指示

步骤 1：准备项目

确认要部署的项目目录。

支持的框架：

  • React：Next.js、Gatsby、Create React App、Remix、React Router
  • Vue：Nuxt、Vitepress、Vuepress、Gridsome
  • Svelte：SvelteKit、Svelte、Sapper
  • 其他前端：Astro、Solid Start、Angular、Ember、Preact、Docusaurus
  • 后端：Express、Hono、Fastify、NestJS、Elysia、h3、Nitro
  • 构建工具：Vite、Parcel
  • 以及更多：Blitz、Hydrogen、RedwoodJS、Storybook、Sanity 等

步骤 2：运行部署

使用脚本（claude.ai 环境）：

bash /mnt/skills/user/vercel-deploy/scripts/deploy.sh [路径]

参数：

  • 路径 – 要部署的目录，或一个 .tgz 文件（默认为当前目录）

示例：

# 部署当前目录
bash /mnt/skills/user/vercel-deploy/scripts/deploy.sh

# 部署特定项目
bash /mnt/skills/user/vercel-deploy/scripts/deploy.sh /path/to/project

# 部署现有的 tarball
bash /mnt/skills/user/vercel-deploy/scripts/deploy.sh /path/to/project.tgz

步骤 3：验证结果

部署成功时，会返回两个 URL：

  • 预览 URL：您可以立即访问的实时站点
  • 认领 URL：将此部署转移到您的 Vercel 账户

输出格式

控制台输出

准备部署...
检测到框架：nextjs
正在创建部署包...
正在部署...
✓ 部署成功！

预览 URL：https：//skill-deploy-abc123.vercel.app
认领 URL：  https：//vercel.com/claim-deployment?code=...

JSON 输出（用于自动化）

{
  "previewUrl": "https://skill-deploy-abc123.vercel.app",
  "claimUrl": "https://vercel.com/claim-deployment?code=...",
  "deploymentId": "dpl_...",
  "projectId": "prj_..."
}

静态 HTML 项目

对于没有 package.json 的项目：

  • 如果有一个不是 index.html 的单个 .html 文件，它会被自动重命名
  • 这确保了页面在根 URL（/）上被服务

向用户呈现结果

始终显示两个 URL：

✓ 部署成功！

预览 URL：https：//skill-deploy-abc123.vercel.app
认领 URL：  https：//vercel.com/claim-deployment?code=...

在预览 URL 查看您的站点。
要将此部署转移到您的 Vercel 账户，请访问认领 URL。

故障排除

网络出口错误

如果因网络限制导致部署失败（常见于 claude.ai），请告知用户：

由于网络限制，部署失败。要解决此问题：

1. 访问 https：//claude.ai/settings/capabilities
2. 将 *.vercel.com 添加到允许的域名
3. 再次尝试部署

框架未检测到

如果未检测到框架：

  1. 检查 package.json 是否存在
  2. 检查您的依赖项是否包含框架包
  3. 手动设置 framework 参数

约束条件

必需规则（必须遵守）

  1. 显示两个 URL：向用户显示预览 URL 和认领 URL
  2. 框架检测：从 package.json 自动检测
  3. 显示错误消息：如果部署失败，显示清晰的错误消息

禁止事项（不得违反）

  1. 包含 node_modules：不要在 tarball 中包含 node_modules
  2. 包含 .git：不要在 tarball 中包含 .git 目录
  3. 硬编码凭据：无需认证（可认领部署）

最佳实践

  1. 自动框架检测：通过分析 package.json 选择最佳设置
  2. 干净的 Tarball：排除 node_modules 和 .git 以加快上传速度
  3. 清晰的输出：清晰地区分预览 URL 和认领 URL

参考资料

元数据

版本

  • 当前版本：1.0.0
  • 最后更新：2026-01-22
  • 支持平台：Claude (claude.ai)
  • 来源：vercel/agent-skills

相关技能

标签

#部署 #vercel #预览 #生产环境 #托管 #serverless #基础设施

📄 原始文档

完整文档（英文）：

https://skills.sh/supercent-io/skills-template/vercel-deploy

💡 提示：点击上方链接查看 skills.sh 原始英文文档，方便对照翻译。

声明：本站所有文章，如无特殊说明或标注，均为本站原创发布。任何个人或组织，在未征得本站同意时，禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益，可联系我们进行处理。