Vercel AI SDK

技能简介

Vercel AI SDK 是由 Vercel 团队打造的下一代 AI 应用开发工具包，专为 TypeScript/JavaScript 开发者设计。它的核心价值在于：用同一套 API 接口，无缝切换 OpenAI、Anthropic (Claude)、Google Gemini 等所有主流大模型厂商，无需为每个模型重写代码。SDK 深度集成 Vercel AI Gateway，支持负载均衡、自动重试、模型降级等生产级能力，同时保留直接调用厂商 SDK 的灵活性。无论是构建聊天机器人、AI Agent 还是带工具调用的自动化工作流，AI SDK 都能大幅降低接入成本，让开发者专注于业务逻辑而非模型对接细节。

核心能力

1. 统一 Provider 架构：只需学会一套 API，通过更换模型字符串（如 anthropic/claude-opus-4-6 或 openai/gpt-5-4）即可切换底层模型，无需修改业务代码。

2. Vercel AI Gateway 集成：开箱即用的网关能力，支持多模型负载均衡、请求缓存、模型自动降级，大幅提升生产环境的稳定性和成本控制能力。

3. 丰富的生成能力：支持纯文本生成、结构化数据输出（集成 Zod schema 验证）、流式响应（Streaming），覆盖从简单问答到复杂 Agent 的全场景。

4. 内置 Agent 开发框架：提供 ToolLoopAgent 等开箱即用的 Agent 抽象，内置工具循环执行逻辑，开发者只需定义工具函数即可构建自主执行型 AI Agent。

5. 多框架 UI 集成：提供 React、Next.js、Svelte、Vue 的 hooks（useChat、useCompletion），快速构建流式聊天界面，零配置接入流式输出。

6. Structured Output：基于 Zod schema 的结构化输出，LLM 生成结果自动校验类型，告别手动解析 JSON 的繁琐。

7. 跨运行时支持：支持 Node.js、Next.js App Router、Edge Functions、Vercel Sandbox 等多种运行环境，云端本地一致体验。

安装配置

环境要求：

• Node.js 22 及以上
• npm / pnpm / bun 等包管理器

基础安装：

npm install ai

安装各模型 Provider（如需直接调用）：

npm install @ai-sdk/openai
npm install @ai-sdk/anthropic
npm install @ai-sdk/google

Coding Agent 场景（推荐）：

npx skills add vercel/ai

使用步骤

第一步：配置模型 Provider

通过 Vercel AI Gateway（推荐）或直接安装厂商 SDK 包两种方式配置模型：

// 方式一：通过 AI Gateway（一个 API Key 调用所有模型）
const { text } = await generateText({
  model: "anthropic/claude-opus-4-6",
  prompt: "你好，介绍一下你自己",
});

// 方式二：直接使用厂商 SDK
import { anthropic } from "@ai-sdk/anthropic";
const { text } = await generateText({
  model: anthropic("claude-opus-4-6"),
  prompt: "你好，介绍一下你自己",
});

第二步：构建结构化输出（可选）

利用 Zod schema 定义输出格式，LLM 自动生成符合结构的数据：

import { generateText, Output } from "ai";
import { z } from "zod";

const { output } = await generateText({
  model: "openai/gpt-5-4",
  output: Output.object({
    schema: z.object({
      recipe: z.object({
        name: z.string(),
        ingredients: z.array(z.object({ name: z.string(), amount: z.string() })),
        steps: z.array(z.string()),
      }),
    }),
  }),
  prompt: "Generate a lasagna recipe.",
});

第三步：构建 AI Agent

使用 ToolLoopAgent 构建可调用工具的自主 Agent：

import { ToolLoopAgent } from "ai";

const agent = new ToolLoopAgent({
  model: "openai/gpt-5-4",
  system: "你是一个可以执行 Shell 命令的 AI 助手",
  tools: {
    shell: openai.tools.localShell({ ... }),
  },
});

第四步：集成前端 UI（以 Next.js 为例）

安装 React hooks 包并在 API Route 中接入流式响应：

npm install @ai-sdk/react

// app/api/chat/route.ts
import { createAgentUIStreamResponse } from "ai";

export async function POST(req: Request) {
  const { messages } = await req.json();
  return createAgentUIStreamResponse({ agent, messages });
}

适用场景

1. 多模型切换场景：同一套代码需要在不同大模型之间切换（如 Claude / GPT / Gemini），避免重复对接工作。

2. 生产级 AI 应用：需要网关的负载均衡、缓存、模型降级等能力，保障服务稳定性。

3. AI Agent 开发：需要构建带工具调用能力的自主 Agent（如代码执行、文件操作、网络搜索）。

4. 流式聊天界面：构建 ChatGPT 风格的实时流式响应聊天机器人，多框架支持。

适用人群

• 前端/全栈工程师：使用 React、Next.js、Svelte、Vue 框架构建 AI 聊天界面的开发者。
• 后端工程师：需要统一接入多个大模型 API、构建生产级 AI 服务的 Node.js 开发者。
• AI 应用创业者：快速验证 AI 产品想法，需要一套代码兼容多个模型厂商的独立开发者。
• Coding Agent 用户：使用 Claude Code、Cursor 等 AI 编程工具时，通过 AI SDK Skill 增强 Agent 的模型调用能力。

工作原理

Vercel AI SDK 的核心是 Provider 抽象层。每个模型厂商（如 OpenAI、Anthropic、Google）都有一个对应的 Provider 包（如 @ai-sdk/openai、@ai-sdk/anthropic），Provider 暴露统一的接口（generateText、streamText、embed 等），上层应用无需关心底层细节。

通过 Vercel AI Gateway 时，SDK 将请求路由至网关，由网关处理认证、负载均衡、缓存和模型路由；直连模式则由 Provider 包直接与厂商 API 通信。两种模式切换只需修改模型字符串，不影响业务代码。

官方链接

• 官网文档：https://ai-sdk.dev/docs
• npm 主页：https://www.npmjs.com/package/ai
• GitHub 仓库：https://github.com/vercel/ai
• AI Gateway 文档：https://vercel.com/docs/ai-gateway