[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"project-3667":3},{"id":4,"name":5,"fullName":6,"owner":7,"repo":5,"description":8,"homepage":9,"htmlUrl":10,"language":11,"languages":10,"totalLinesOfCode":10,"stars":12,"forks":13,"watchers":14,"openIssues":15,"contributorsCount":16,"subscribersCount":16,"size":16,"stars1d":17,"stars7d":18,"stars30d":19,"stars90d":16,"forks30d":16,"starsTrendScore":20,"compositeScore":21,"rankGlobal":10,"rankLanguage":10,"license":22,"archived":23,"fork":23,"defaultBranch":24,"hasWiki":23,"hasPages":23,"topics":25,"createdAt":10,"pushedAt":10,"updatedAt":40,"readmeContent":41,"aiSummary":42,"trendingCount":16,"starSnapshotCount":16,"syncStatus":43,"lastSyncTime":44,"discoverSource":45},3667,"ai","vercel\u002Fai","vercel","The AI Toolkit for TypeScript. From the creators of Next.js, the AI SDK is a free open-source library for building AI-powered applications and agents ","https:\u002F\u002Fai-sdk.dev",null,"TypeScript",24800,4567,142,1007,0,20,140,640,108,45,"Other",false,"main",[26,27,28,29,30,31,32,33,34,35,36,37,38,7,39],"anthropic","artificial-intelligence","gemini","generative-ai","generative-ui","javascript","language-model","llm","nextjs","openai","react","svelte","typescript","vue","2026-06-12 02:00:52","![hero illustration](.\u002Fassets\u002Fhero.gif)\n\n# AI SDK\n\nThe [AI SDK](https:\u002F\u002Fai-sdk.dev\u002Fdocs) is a provider-agnostic TypeScript toolkit designed to help you build AI-powered applications and agents using popular UI frameworks like Next.js, React, Svelte, Vue, Angular, and runtimes like Node.js.\n\nTo learn more about how to use the AI SDK, check out our [API Reference](https:\u002F\u002Fai-sdk.dev\u002Fdocs\u002Freference) and [Documentation](https:\u002F\u002Fai-sdk.dev\u002Fdocs).\n\n## Installation\n\nYou will need Node.js 18+ and npm (or another package manager) installed on your local development machine.\n\n```shell\nnpm install ai\n```\n\n## Skill for Coding Agents\n\nIf you use coding agents such as Claude Code or Cursor, we highly recommend adding the AI SDK skill to your repository:\n\n```shell\nnpx skills add vercel\u002Fai\n```\n\n## Unified Provider Architecture\n\nThe AI SDK provides a [unified API](https:\u002F\u002Fai-sdk.dev\u002Fdocs\u002Ffoundations\u002Fproviders-and-models) to interact with model providers like [OpenAI](https:\u002F\u002Fai-sdk.dev\u002Fproviders\u002Fai-sdk-providers\u002Fopenai), [Anthropic](https:\u002F\u002Fai-sdk.dev\u002Fproviders\u002Fai-sdk-providers\u002Fanthropic), [Google](https:\u002F\u002Fai-sdk.dev\u002Fproviders\u002Fai-sdk-providers\u002Fgoogle), and [more](https:\u002F\u002Fai-sdk.dev\u002Fproviders\u002Fai-sdk-providers).\n\nBy default, the AI SDK uses the [Vercel AI Gateway](https:\u002F\u002Fvercel.com\u002Fdocs\u002Fai-gateway) to give you access to all major providers out of the box. Just pass a model string for any supported model:\n\n```ts\nconst result = await generateText({\n  model: 'anthropic\u002Fclaude-opus-4.6', \u002F\u002F or 'openai\u002Fgpt-5.4', 'google\u002Fgemini-3-flash', etc.\n  prompt: 'Hello!',\n});\n```\n\nYou can also connect to providers directly using their SDK packages:\n\n```shell\nnpm install @ai-sdk\u002Fopenai @ai-sdk\u002Fanthropic @ai-sdk\u002Fgoogle\n```\n\n```ts\nimport { anthropic } from '@ai-sdk\u002Fanthropic';\n\nconst result = await generateText({\n  model: anthropic('claude-opus-4-6'), \u002F\u002F or openai('gpt-5.4'), google('gemini-3-flash'), etc.\n  prompt: 'Hello!',\n});\n```\n\n## Usage\n\n### Generating Text\n\n```ts\nimport { generateText } from 'ai';\n\nconst { text } = await generateText({\n  model: 'openai\u002Fgpt-5.4', \u002F\u002F use Vercel AI Gateway\n  prompt: 'What is an agent?',\n});\n```\n\n### Generating Structured Data\n\n```ts\nimport { generateText, Output } from 'ai';\nimport { z } from 'zod';\n\nconst { output } = await generateText({\n  model: 'openai\u002Fgpt-5.4',\n  output: Output.object({\n    schema: z.object({\n      recipe: z.object({\n        name: z.string(),\n        ingredients: z.array(\n          z.object({ name: z.string(), amount: z.string() }),\n        ),\n        steps: z.array(z.string()),\n      }),\n    }),\n  }),\n  prompt: 'Generate a lasagna recipe.',\n});\n```\n\n### Agents\n\n```ts\nimport { ToolLoopAgent } from 'ai';\n\nconst sandboxAgent = new ToolLoopAgent({\n  model: 'openai\u002Fgpt-5.4',\n  system: 'You are an agent with access to a shell environment.',\n  tools: {\n    shell: openai.tools.localShell({\n      execute: async ({ action }) => {\n        const [cmd, ...args] = action.command;\n        const sandbox = await getSandbox(); \u002F\u002F Vercel Sandbox\n        const command = await sandbox.runCommand({ cmd, args });\n        return { output: await command.stdout() };\n      },\n    }),\n  },\n});\n```\n\n### UI Integration\n\nThe [AI SDK UI](https:\u002F\u002Fai-sdk.dev\u002Fdocs\u002Fai-sdk-ui\u002Foverview) module provides a set of hooks that help you build chatbots and generative user interfaces. These hooks are framework agnostic, so they can be used in Next.js, React, Svelte, and Vue.\n\nYou need to install the package for your framework, e.g.:\n\n```shell\nnpm install @ai-sdk\u002Freact\n```\n\n#### Agent @\u002Fagent\u002Fimage-generation-agent.ts\n\n```ts\nimport { openai } from '@ai-sdk\u002Fopenai';\nimport { ToolLoopAgent, InferAgentUIMessage } from 'ai';\n\nexport const imageGenerationAgent = new ToolLoopAgent({\n  model: 'openai\u002Fgpt-5.4',\n  tools: {\n    generateImage: openai.tools.imageGeneration({\n      partialImages: 3,\n    }),\n  },\n});\n\nexport type ImageGenerationAgentMessage = InferAgentUIMessage\u003C\n  typeof imageGenerationAgent\n>;\n```\n\n#### Route (Next.js App Router) @\u002Fapp\u002Fapi\u002Fchat\u002Froute.ts\n\n```tsx\nimport { imageGenerationAgent } from '@\u002Fagent\u002Fimage-generation-agent';\nimport { createAgentUIStreamResponse } from 'ai';\n\nexport async function POST(req: Request) {\n  const { messages } = await req.json();\n\n  return createAgentUIStreamResponse({\n    agent: imageGenerationAgent,\n    messages,\n  });\n}\n```\n\n#### UI Component for Tool @\u002Fcomponent\u002Fimage-generation-view.tsx\n\n```tsx\nimport { openai } from '@ai-sdk\u002Fopenai';\nimport { UIToolInvocation } from 'ai';\n\nexport default function ImageGenerationView({\n  invocation,\n}: {\n  invocation: UIToolInvocation\u003CReturnType\u003Ctypeof openai.tools.imageGeneration>>;\n}) {\n  switch (invocation.state) {\n    case 'input-available':\n      return \u003Cdiv>Generating image...\u003C\u002Fdiv>;\n    case 'output-available':\n      return \u003Cimg src={`data:image\u002Fpng;base64,${invocation.output.result}`} \u002F>;\n  }\n}\n```\n\n#### Page @\u002Fapp\u002Fpage.tsx\n\n```tsx\n'use client';\n\nimport { ImageGenerationAgentMessage } from '@\u002Fagent\u002Fimage-generation-agent';\nimport ImageGenerationView from '@\u002Fcomponent\u002Fimage-generation-view';\nimport { useChat } from '@ai-sdk\u002Freact';\n\nexport default function Page() {\n  const { messages, status, sendMessage } =\n    useChat\u003CImageGenerationAgentMessage>();\n\n  const [input, setInput] = useState('');\n  const handleSubmit = e => {\n    e.preventDefault();\n    sendMessage({ text: input });\n    setInput('');\n  };\n\n  return (\n    \u003Cdiv>\n      {messages.map(message => (\n        \u003Cdiv key={message.id}>\n          \u003Cstrong>{`${message.role}: `}\u003C\u002Fstrong>\n          {message.parts.map((part, index) => {\n            switch (part.type) {\n              case 'text':\n                return \u003Cdiv key={index}>{part.text}\u003C\u002Fdiv>;\n              case 'tool-generateImage':\n                return \u003CImageGenerationView key={index} invocation={part} \u002F>;\n            }\n          })}\n        \u003C\u002Fdiv>\n      ))}\n\n      \u003Cform onSubmit={handleSubmit}>\n        \u003Cinput\n          value={input}\n          onChange={e => setInput(e.target.value)}\n          disabled={status !== 'ready'}\n        \u002F>\n      \u003C\u002Fform>\n    \u003C\u002Fdiv>\n  );\n}\n```\n\n## Templates\n\nWe've built [templates](https:\u002F\u002Fai-sdk.dev\u002Fdocs\u002Fintroduction#templates) that include AI SDK integrations for different use cases, providers, and frameworks. You can use these templates to get started with your AI-powered application.\n\n## Community\n\nThe AI SDK community can be found on [the Vercel Community](https:\u002F\u002Fcommunity.vercel.com\u002Fc\u002Fai-sdk\u002F62) where you can ask questions, voice ideas, and share your projects with other people.\n\n## Contributing\n\nContributions to the AI SDK are welcome and highly appreciated. However, before you jump right into it, we would like you to review our [Contribution Guidelines](https:\u002F\u002Fgithub.com\u002Fvercel\u002Fai\u002Fblob\u002Fmain\u002FCONTRIBUTING.md) to make sure you have smooth experience contributing to AI SDK.\n\n## Authors\n\nThis library is created by [Vercel](https:\u002F\u002Fvercel.com) and [Next.js](https:\u002F\u002Fnextjs.org) team members, with contributions from the [Open Source Community](https:\u002F\u002Fgithub.com\u002Fvercel\u002Fai\u002Fgraphs\u002Fcontributors).\n","vercel\u002Fai 是一个用于构建AI驱动应用和代理的TypeScript工具包。该项目提供了一个统一的API接口，支持多种模型提供商（如OpenAI、Anthropic、Google等），并能够与Next.js、React、Svelte、Vue等流行的UI框架无缝集成。其核心功能包括生成文本、结构化数据以及创建具有特定技能的编码代理。通过Vercel AI Gateway，开发者可以轻松访问各大主流AI服务。此外，它还支持直接连接到各个供应商的服务端点。适用于需要快速集成人工智能功能于Web应用或开发智能代理的场景中，尤其适合熟悉TypeScript及现代前端技术栈的开发者使用。",2,"2026-06-11 02:55:24","top_language"]