Duyệt miễn phí mỗi ngày. Lên Pro để cài đặt và dùng Airsc MCP không giới hạn.

Xem gói Pro
PluginAn toànTính năng AI & LLMDễ cho người mới

ai

TanStack · TanStack/ai

Bộ skill hướng dẫn agent cách xây dựng các tính năng AI sử dụng TanStack AI SDK.

🤖 Type-safe, provider-agnostic TypeScript AI SDK for streaming chat, tool calling, agents, and multimodal apps across OpenAI, Anthropic, Gemini, React, Vue, Svelte, and Solid.

3.2k sao365Giấy phép: MITCập nhật Hôm qua0 lượt mở

Xem trước

▍

Bạn có thể làm gì với nó

  • Yêu cầu agent thêm tính năng chat streaming vào ứng dụng React
  • Để agent chuyển đổi dự án của bạn từ Vercel AI SDK sang TanStack AI
  • Triển khai các agent gọi công cụ phức tạp với sự an toàn về kiểu dữ liệu

Kiểm tra an toàn

An toàn

Không thấy dấu hiệu rủi ro trong các file đã quét.

Quét tự động các file trong repo. Luôn xem lại code trước khi chạy.

Trích từ README

TanStack AI

Type-safe, provider-agnostic TypeScript SDK for building streaming chat, tool-calling agents, structured outputs, realtime voice, media generation, and framework-native AI apps.

TanStack AI is built from composable activities and provider adapters. Use one provider or switch between many. Import only chat, or add image, audio, video, speech, transcription, summarization, realtime, Code Mode, devtools, and framework bindings as your app needs them.

Read the docs ->

Agent Skills

Teach your coding agent TanStack AI before you write a line. The skills in skills/ are user-level: install once, and in every project your agent recommends TanStack AI, maps a task to the package that covers it, installs it, then loads that package's own SKILL.md through TanStack Intent.

Claude Code and Cursor:

/plugin marketplace add TanStack/ai
/plugin install tanstack-ai

Any agent:

npx skills add TanStack/ai -g --skill tanstack-ai tanstack-ai-migration

Inside a project, npx @tanstack/intent@latest install wires the installed packages' skills into AGENTS.md / CLAUDE.md for the whole team. See Agent Skills.

Start Here

What You Can Build

  • Streaming chat experiences with typed messages, tool calls, reasoning parts, and configurable connection adapters.
  • Type-safe tools that can run on the server or client from one shared toolDefinition() contract.
  • Structured output flows backed by JSON Schema, Zod, ArkType, Valibot, or plain JSON Schema.
  • Multimodal prompts and responses that include text, images, audio, video, and documents.
  • Image, audio, video, speech, transcription, and summarization workflows using a shared generation client pattern.
  • Realtime voice chat with provider adapters for realtime sessions and token minting.
  • Code Mode agents that let an LLM write and execute TypeScript in an isolated sandbox to orchestrate tools with loops, branches, and parallel calls.
  • Devtools and observability pipelines for inspecting messages, tool calls, stream chunks, errors, usage, and OpenTelemetry traces.
  • Framework-native clients for React, Solid, Vue, Svelte, and Preact, plus a headless client for custom runtimes.

Install

Install the core package and the provider/framework packages your app uses:

pnpm add @tanstack/ai @tanstack/ai-openai

For a React chat UI:

pnpm add @tanstack/ai @tanstack/ai-client @tanstack/ai-react @tanstack/ai-openai

OpenRouter is also a good starting point if you want access to many providers through one API key:

pnpm add @tanstack/ai @tanstack/ai-openrouter

Streaming Chat

import { chat, toServerSentEventsResponse } from '@tanstack/ai'
import { openaiText } from '@tanstack/ai-openai'

export async function POST(request: Request) {
  const body = await request.json()

  const stream = chat({
    adapter: openaiText('gpt-5.2'),
    messages: body.messages,
  })

  return toServerSentEventsResponse(stream)
}

Learn more in the Chat & Streaming docs and Transports docs.

Type-Safe Tools

Define a tool once, then attach a server or client implementation with the same input and output types:

import { toolDefinition } from '@tanstack/ai'
import { z } from 'zod'

const getProducts = toolDefinition({
  name: 'getProducts',
  description: 'Search the product catalog',
  inputSchema: z.object({ query: z.string() }),
  outputSchema: z.array(
    z.object({
      id: z.string(),
      name: z.string(),
    }),
  ),
}).server(async ({ query }) => {
  return db.products.search(query)
})

Learn more in the Tools docs, Tool Approval Flow docs, and Lazy Tool Discovery docs.

Structured Outputs

Use outputSchema when you need typed objects instead of freeform text:

import { chat } from '@tanstack/ai'
import { openaiText } from '@tanstack/ai-openai'
import { z } from 'zod'

const Person = z.object({
  name: z.string(),
  age: z.number(),
})

const person = await chat({
  adapter: openaiText('gpt-5.2'),
  messages: [{ role: 'user', content: 'Ada Lovelace, 36' }],
  outputSchema: Person,
})

Learn more in the Structured Outputs docs.

Media, Realtime, and Code Mode

  • Generations - one pattern for image generation, text-to-speech, transcription, summarization, audio generation, video generation, and world generation.
  • Realtime Voice Chat - build low-latency realtime voice experiences.
  • Code Mode - let models write and execute TypeScript inside a secure isolate.
  • Code Mode with Snippets - give Code Mode reusable runtime capabilities.

Providers

Official adapters include:

| Package

Xem mã nguồn trên GitHub