Vercel Agent Skills 全面指南 (2026)
如何在您的部署工作流中使用 Vercel 的 AI agent 功能
开始使用 Hypereal 构建
通过单个 API 访问 Kling、Flux、Sora、Veo 等。免费积分开始,扩展到数百万。
无需信用卡 • 10万+ 开发者 • 企业级服务
Vercel Agent Skills:完整指南 (2026)
Vercel Agent Skills 让 AI 编程代理能够直接与 Vercel 平台交互 —— 部署预览版、管理环境变量、查询构建日志以及运行诊断,所有这些都可以在你的 AI 辅助开发工作流中完成。你的 AI 代理能够为你处理部署生命周期,而无需在你编辑器和 Vercel 控制台之间来回切换。
本指南涵盖了什么是 Agent Skills、如何设置它们,以及如何有效地配合各种热门 AI 编程代理使用。
什么是 Vercel Agent Skills?
Agent Skills 是 Vercel 通过 Model Context Protocol (MCP) 开放的一组工具。当 AI 编程代理(如 Claude Code, Cursor 或 Cline)连接到 Vercel 的 MCP 服务器时,它将获得以下能力:
- 触发并监控部署
- 读取构建(build)和运行时(runtime)日志
- 管理环境变量
- 检查项目配置
- 运行 Web Vitals 诊断
- 管理域名和 DNS 设置
可以将 Agent Skills 视为赋予了你的 AI 助手对 Vercel 控制台的管理员访问权限,且完全通过自然语言进行控制。
设置 Vercel Agent Skills
前提条件
- 一个至少拥有一个项目的 Vercel 账号
- 一个 Vercel API 令牌(Settings > Tokens)
- 一个支持 MCP 的 AI 编程代理
步骤 1:生成 Vercel 令牌 (Token)
访问 vercel.com/account/tokens 并创建一个新令牌:
- Name: Agent Skills
- Scope: 你的团队或个人账号
- Expiration: 根据你的安全需求进行选择
步骤 2:配置 MCP
配置方式取决于你使用的 AI 代理。
对于 Claude Code (claude_desktop_config.json):
{
"mcpServers": {
"vercel": {
"command": "npx",
"args": ["-y", "vercel-mcp-server"],
"env": {
"VERCEL_TOKEN": "your_token_here"
}
}
}
}
对于 Cursor (.cursor/mcp.json):
{
"mcpServers": {
"vercel": {
"command": "npx",
"args": ["-y", "vercel-mcp-server"],
"env": {
"VERCEL_TOKEN": "your_token_here"
}
}
}
}
对于 Cline (VS Code 设置):
通过 Cline 的 MCP 设置面板添加带有相同命令和环境变量的 MCP 服务器配置。
步骤 3:验证连接
配置好 MCP 服务器后,通过询问 AI 代理进行测试:
"列出我的 Vercel 项目"
如果配置正确,代理应该会返回你的 Vercel 项目列表。
可用的 Agent Skills
部署相关 (Deployment Skills)
| 技能 | 描述 | 示例提示词 |
|---|---|---|
list_deployments |
列出最近的部署 | "显示我最近的 5 次部署" |
get_deployment |
获取部署详情 | "最新的部署状态是什么?" |
create_deployment |
触发新部署 | "将当前分支部署到预览环境" |
get_deployment_logs |
读取构建和运行时日志 | "显示失败部署的构建日志" |
cancel_deployment |
取消正在进行的构建 | "取消当前的部署" |
项目管理相关 (Project Management Skills)
| 技能 | 描述 | 示例提示词 |
|---|---|---|
list_projects |
列出所有项目 | "列出我的 Vercel 项目" |
get_project |
获取项目配置 | "显示 my-app 项目的配置" |
update_project |
更新项目设置 | "为此项目设置 Node.js 版本为 22" |
list_domains |
列出项目域名 | "这个项目配置了哪些域名?" |
环境变量相关 (Environment Variable Skills)
| 技能 | 描述 | 示例提示词 |
|---|---|---|
list_env_vars |
列出环境变量 | "显示生产环境的所有环境变量" |
create_env_var |
添加新的环境变量 | "向生产环境添加 DATABASE_URL" |
update_env_var |
更新现有变量 | "更新 staging 环境的 API_KEY" |
delete_env_var |
移除变量 | "移除已废弃的 LEGACY_KEY 变量" |
诊断相关 (Diagnostics Skills)
| 技能 | 描述 | 示例提示词 |
|---|---|---|
get_web_vitals |
检查核心网页指标 | "my-app 的 Web Vitals 表现如何?" |
get_speed_insights |
获取性能数据 | "显示过去 7 天的速度洞察" |
check_dns |
验证 DNS 配置 | "检查我的域名 DNS 是否配置正确" |
实际工作流
工作流 1:部署并验证
以下是使用 Vercel 技能与 AI 代理的典型对话:
用户:"部署当前分支并显示构建日志"
代理:我将触发部署并进行监控。
[调用 create_deployment]
部署已开始:dpl_abc123
[轮询调用 get_deployment_logs]
构建在 42 秒内完成。摘要如下:
- 框架:Next.js 15.2
- 构建耗时:42s
- 输出大小:2.3 MB
- 预览链接:https://my-app-abc123.vercel.app
构建日志中没有错误或警告。
工作流 2:调试失败的部署
用户:"最近一次部署失败了。发生了什么?"
代理:让我检查一下部署日志。
[调用 list_deployments]
[针对最近失败的部署调用 get_deployment_logs]
部署在构建阶段失败。错误如下:
Error: Module not found: Can't resolve '@/components/NewFeature'
该文件在 src/app/page.tsx:14 中被引用,但并不存在。
你需要创建该组件或移除对应的 import。
工作流 3:环境变量管理
用户:"添加生产环境的 Stripe 密钥。
STRIPE_PUBLIC_KEY=pk_live_xxx
STRIPE_SECRET_KEY=sk_live_xxx"
代理:我将这两个环境变量添加到生产环境中。
[为 STRIPE_PUBLIC_KEY 调用 create_env_var,目标:production]
[为 STRIPE_SECRET_KEY 调用 create_env_var,目标:production]
操作完成。这两个变量现在已为生产环境设置:
- STRIPE_PUBLIC_KEY: pk_live_xxx (production)
- STRIPE_SECRET_KEY: sk_live_xxx (production, 已加密)
注意:你需要重新部署才能使这些设置生效。
需要我触发一次生产环境部署吗?
工作流 4:性能监控
用户:"检查我们生产站点的 Web Vitals"
代理:[为 production 调用 get_web_vitals]
以下是过去 28 天的核心网页指标:
| 指标 | 数值 | 评级 |
|--------|-------|--------|
| LCP | 1.8s | 良好 |
| INP | 120ms | 良好 |
| CLS | 0.08 | 待改进 |
CLS 略高于 0.05 的阈值。主要偏差来源是由于 Hero 图片加载时未指定显式的 width/height 属性导致的布局偏移。
创建自定义技能 (Custom Skills)
你可以通过在自定义 MCP 工具中封装 Vercel API 来扩展 Vercel Agent Skills。以下是使用 MCP SDK 的示例:
import { McpServer } from "@modelcontextprotocol/sdk/server/mcp.js";
import { z } from "zod";
const server = new McpServer({
name: "custom-vercel-skills",
version: "1.0.0",
});
// 自定义技能:比较两次部署
server.tool(
"compare_deployments",
"比较两次部署之间的构建时间和大小",
{
deployment1: z.string().describe("第一个部署的 ID"),
deployment2: z.string().describe("第二个部署的 ID"),
},
async ({ deployment1, deployment2 }) => {
const [d1, d2] = await Promise.all([
fetchDeployment(deployment1),
fetchDeployment(deployment2),
]);
return {
content: [{
type: "text",
text: JSON.stringify({
buildTimeDiff: d2.buildTime - d1.buildTime,
sizeDiff: d2.outputSize - d1.outputSize,
deployment1: { buildTime: d1.buildTime, size: d1.outputSize },
deployment2: { buildTime: d2.buildTime, size: d2.outputSize },
}, null, 2),
}],
};
}
);
最佳实践
1. 使用限定范围的令牌
创建具有最小所需权限的令牌。如果你的代理只需要读取部署的权限,请不要赋予它写入环境变量的权限。
2. 设置团队级令牌
对于团队开发,请使用团队范围(team-scoped)的令牌而不是个人令牌。这可以确保在团队成员离职时访问权限依然持续。
3. 在部署到生产环境前进行预研
虽然 Agent Skills 可以部署到生产环境,但建议在工作流中设置确认步骤:
用户:"部署到生产环境"
代理:这将部署到生产环境 (my-app.com)。
当前的预览版运行健康,所有检查均已通过。
是否继续?
用户:"是的,继续"
4. 结合 Git 工作流
Agent Skills 在配合适当的 Git 工作流时效果最佳。利用它们来:
- 部署功能分支以供预览
- 在推送到代码库后检查构建状态
- 在生产环境部署后验证 Web Vitals
- 在新成员入职期间管理环境变量
故障排除
"Tool not found" 错误: 确保 MCP 服务器正在运行。更改配置后重启你的 AI 代理。
"Unauthorized" 错误: 你的 Vercel 令牌可能已过期或缺少权限。请生成一个具有正确范围的新令牌。
"Project not found" 错误:
验证项目名称或 ID 是否完全匹配。先使用 list_projects 查看可用项目。
结论
Vercel Agent Skills 弥补了 AI 编程代理与部署平台之间的鸿沟。通过 MCP 将你的 AI 助手连接到 Vercel,你可以不用离开开发环境即可管理部署、环境变量和性能监控。
对于在 Vercel 上构建 AI 媒体应用的开发者,Hypereal AI 提供了 AI 图像和视频生成的 API,这些 API 可以无缝部署为 Vercel Serverless Functions,打造从代码到生产的流畅管线。
