Vercel AI SDK skill
Vercel AI SDK skill: an agent writes chat, streaming and agents from the docs of the installed package version
- 27,894 ★ on the repository
- Last commit
Extended access
Why this level
- The agent installs npm packages and writes code that calls paid model APIs
- For answers the agent may query ai-gateway.vercel.sh for the model list
Install
- Works in
Manual install
npx skills add vercel/aiThe command from the AI SDK README and docs. The `-a` flag selects agents and `-y` skips prompts.
Access and checks
How we reviewExtended accessThe tool runs code or makes network calls and only reads external data.
- The agent installs npm packages and writes code that calls paid model APIs
- For answers the agent may query ai-gateway.vercel.sh for the model list
This is third-party code. Review the repository files before installing.
What it does
The `ai-sdk` skill answers questions about the AI SDK, Vercel's TypeScript library, and helps build features on it: chatbots, agents, RAG, structured output, tool calling, embeddings and hooks such as `useChat`. Its main rule is never to write code from memory. The agent opens the docs and source in `node_modules/ai/docs/` and `node_modules/ai/src/`, and if the `ai` package is missing it installs only that first. The skill explains how to start with the Vercel AI Gateway: the key goes into `AI_GATEWAY_API_KEY`, models are set with a `provider/model` string, and the current list comes from a request to `ai-gateway.vercel.sh`. For agents it recommends the built-in `ToolLoopAgent`. For debugging there is the DevTools package that shows requests, responses and tool calls.
Who it is for. TypeScript developers adding chat, an agent or text generation to a Next.js or other app and handing the code to Claude Code, Cursor or Codex.
Good fit when
- A Next.js app gets streaming chat through `streamText` and `useChat`
- A tool-calling agent is built on `ToolLoopAgent` instead of a hand-written loop
- A model works with project data and the answer comes back as a structured object
- A project on AI SDK 6 moves to version 7 and the agent needs the migration guide
Not a fit when
- The app does not use the AI SDK and calls the model API directly
- Python or another language is required: the library and skill target TypeScript
- Work is going on in the AI SDK repository itself: it has separate skills for that
Example request
Add a streaming chat to our Next.js project through the AI SDK with a model from the Vercel AI GatewayLimitations
The skill relies on the documentation inside the installed `ai` package and on ai-sdk.dev, so with an old package version the answers match that old version. The model selection example in the README uses `anthropic/...` style ids through the Vercel AI Gateway, which needs a gateway key or OIDC when deployed on Vercel. DevTools are marked experimental and meant for local development. `npx skills add vercel/ai` pulls the repository's skills as a whole, including maintainer skills for the SDK itself, unless you pick the right one by hand.
How to disable. Delete the `ai-sdk` skill folder from the project's `.claude/skills/`, `.codex/skills/` or `.agents/skills/`. The `ai` package stays in the dependencies.
FAQ
How do I install the AI SDK skill in Claude Code?
Run `npx skills add vercel/ai` in the project root and pick your agents. The command puts the skill in each agent's directory, for example `.claude/skills` or `.codex/skills`.
Where does the skill get API details?
From the docs and source the `ai` package ships in `node_modules/ai/docs/` and `node_modules/ai/src/`. They match the installed version, and when something is missing the agent searches ai-sdk.dev.
What key does the Vercel AI Gateway need?
A gateway key in the `AI_GATEWAY_API_KEY` variable, or OIDC for deployments on Vercel. Models are set with a `provider/model` string.
How is `ToolLoopAgent` different from a hand-written loop?
It is the SDK's built-in abstraction for tool-calling agents, and the skill recommends it over a custom loop. The UI message type is inferred from the agent definition.
Can I see what an AI SDK agent is doing?
Yes, the DevTools package shows requests, responses, tool calls and token usage in a local web UI. The package is experimental and only suitable for development.
Discussion
No questions or reviews yet.
Related
SkillsNative SDK: agent skill
Native SDK
Skills for the experimental Native SDK: the agent reads version-matched guidance from the installed CLI for building desktop apps in TypeScript
A library of 30-plus instruction skills for coding agents: planning, building, testing, hallucination guards and shipping
A plugin of 24 Claude Code skills for AI apps on Next.js, AI SDK 7, shadcn/ui and pgvector, with in-browser UI checks
skill-kit builds agent skills as typed TypeScript state machines with schema-checked answers and a build into a SKILL.md directory
A library of agent skills for CAD, CAE and CAM: generate and edit models, export STEP, STL, 3MF, robot description files and mesh slicing to g-code
Over 150 skills for building apps on the ibl.ai platform: sign-in, agent chat, profiles, analytics, desktop and mobile builds
Comparison with similar tools
Cards that share the main search query, and how they differ.
| Tool | Official | Repository stars | Main difference |
|---|---|---|---|
| Vercel AI SDK (this card) | yes | 27,894 | |
| Vercel skills for agents | no | 33,964 | a set of general Vercel skills for React and deploys, without the AI SDK |
| skills (npx skills) | no | 39,131 | the `skills` CLI for installing skills, not a skill about the AI SDK |
README in short
After installing the `ai` package, the README has a section on a skill for coding agents with the `npx skills add vercel/ai` command. It then covers the unified provider architecture, the Vercel AI Gateway as the default and connecting providers directly.
README badge
Original SKILL.md
--- name: ai-sdk description: 'Answer questions about the AI SDK and help build AI-powered features. Use when developers: (1) Ask about AI SDK functions like generateText, streamText, ToolLoopAgent, embed, or tools, (2) Want to build AI agents, chatbots, RAG systems, or text generation features, (3) Have questions about AI providers (OpenAI, Anthropic, Google, etc.), streaming, tool calling, structured output, or embeddings, (4) Use React hooks like useChat or useCompletion. Triggers on: "AI SDK", "Vercel AI SDK", "generateText", "streamText", "add AI to my app", "build an agent", "tool calling", "structured output", "useChat".' --- ## What the AI SDK Is The AI SDK by Vercel (the `ai` package on npm) is a TypeScript toolkit for building AI applications. It provides a unified API across model providers for text generation, structured output, tool calling, agents, embeddings, and framework UI integrations. - Repository: https://github.com/vercel/ai - Documentation: https://ai-sdk.dev/docs ## Critical: Do Not Trust Your Own Memory Whatever you remember about the AI SDK is likely outdated. The SDK changes frequently across versions - APIs are renamed, removed, and added. Your training data almost certainly contains obsolete APIs, deprecated patterns, and model IDs that no longer exist. UI hooks like `useChat` are among the most frequently changed APIs, so be especially careful with client code. **Never write AI SDK code from memory.** Always verify every API, option, and pattern against the documentation and source code for the version that is actually installed in the project. ## Use the Bundled, Version-Matched Docs The `ai` package ships its full documentation and source code inside `node_modules`. These always match the installed version, so trust them over anything you remember. 1. Ensure `ai` is installed. Check `node_modules/ai/` or locate the workspace package in a monorepo that depends on `ai` (e.g. `apps/<name>/node_modules/ai/`). If `ai` is not installed anywhere in the project, install **only** the `ai` package into the target package using the project's package manager (e.g. `pnpm add ai --filter <pkg>` or `npm install ai`). Install provider packages (e.g. `@ai-sdk/openai`) and framework packages (e.g. `@ai-sdk/react`) later, when the task requires them. 2. Read and grep the bundled docs at `node_modules/ai/docs/` (or `<package>/node_modules/ai/docs/`) and the source at `node_modules/ai/src/`. 3. Provider and framework packages bundle their own docs at `node_modules/@ai-sdk/<name>/docs/` (or `<package>/node_modules/@ai-sdk/<name>/docs/`). 4. If something isn't in the bundled docs, search https://ai-sdk.dev/docs. You can append `.md` to any docs page URL to get its markdown, and search via `https://ai-sdk.dev/api/search-docs?q=your_query`. 5. If you cannot find support for an answer in the docs or source, say so explicitly — do not guess. ## AI Gateway: The Fastest Way to Start The Vercel AI Gateway is the fastest way to get started with the AI SDK. It provides access to models from OpenAI, Anthropic, Google, and other providers through a single API, without installing provider packages or managing multiple API keys. To set it up: 1. Authenticate with OIDC (for Vercel deployments) or get an AI Gateway API key. 2. Provide it to your app via the `AI_GATEWAY_API_KEY` environment variable. 3. Reference models with `provider/model` strings. For exact setup, authentication, and usage, read the bundled guide and the AI Gateway docs. ### Choosing a Model Never use model IDs from memory — models are released and retired frequently. Fetch the current list before writing code that references a model. Do not truncate the list (e.g. with `head`) so you can find the newest models: ```bash