Vercel AI SDK Komplettguide — Eine einheitliche API für OpenAI, Anthropic und Gemini (2026)

"Ich habe auf der OpenAI-API ausgeliefert, moechte aber auch Claude und Gemini ausprobieren" — und schon verbringt man zwei Stunden damit, dieselbe Logik gegen drei verschiedene SDKs neu zu schreiben und Request- und Response-Formate von Hand zu übersetzen. Das Vercel AI SDK (seit 2026 schlicht "AI SDK") reduziert das auf "ein Import, eine Funktion, jeder Anbieter". Eine TypeScript-Open-Source-Bibliothek mit über 20 Millionen monatlichen Downloads; AI SDK 6 liefert Agents, MCP, Tool-Approval und DevTools und ist Stand 15. Mai 2026 der De-facto-Standard für eine einheitliche LLM-Schnittstelle.

Vorab klargestellt: Wer 2026 LLMs aus einer Web-App oder einem Node.js-Projekt aufruft, für den ist das AI SDK der richtige Default, Punkt. Die einzigen Gruende, direkt gegen das OpenAI- oder Anthropic-SDK zu schreiben, sind "bestehende Codebasis" und "brandneue, anbieter-spezifische Funktionen (Anthropic computer use usw.)". Andernfalls liefert das AI SDK "einfaches Wechseln, ein Drittel des Codes, Typsicherheit, React-Integration" mit überwaeltigendem Vorteil.

Persoenliche Einschaetzung vorweg: der eigentliche Wert des AI SDK ist die Freiheit von Vendor-Lock-in. OpenAI hebt die Preise an? Drei Zeilen, um auf Anthropic zu wechseln. Gemini bringt ein neues Modell? An einem Ort ausprobieren. Alles in einer einzigen Codebasis. Wie in Was ist eine AI-API behandelt, ist die Realitaet 2026, dass "mehrere Modelle für verschiedene Aufgaben einsetzen" nun der Standard ist — und das AI SDK druckt die Wechselkosten asymptotisch gegen null. Dieser Artikel deckt ab, was das AI SDK ist, warum man es einsetzt, einen 5-Minuten-Quickstart, strukturierte Ausgabe, Tool calling und Agents, React-Integration, Anbieterwechsel und drei Stolperfallen in Produktion — alles verankert in AI SDK 6 zum Stand 15. Mai 2026.

1. Was ist das AI SDK — "OpenAI/Anthropic/Gemini über eine API"

Das AI SDK ist eine von Vercel gebaute Open-Source-TypeScript-Bibliothek. GitHub: vercel/ai, Lizenz Apache 2.0, über 20 Millionen monatliche Downloads Stand 15. Mai 2026. Von Vercel gebaut, aber laeuft ohne Vercel — Cloudflare Workers, AWS Lambda, Deno, eigenes Node.js, der Browser, alles funktioniert.

Die Kernidee ist eine "Adapter-Schicht zum Wechseln zwischen LLM-Anbietern". Zum Beispiel:

import { generateText } from 'ai';
import { openai } from '@ai-sdk/openai';

const { text } = await generateText({
  model: openai('gpt-5'),
  prompt: 'Tell me today\'s weather',
});

Auf Anthropic umzustellen bedeutet, dass drei Zeilen wechseln:

import { generateText } from 'ai';
import { anthropic } from '@ai-sdk/anthropic';  // ← changed

const { text } = await generateText({
  model: anthropic('claude-opus-4-7'),  // ← changed
  prompt: 'Tell me today\'s weather',
});

Der aufrufende Code ändert sich kein Stück. Genau das bedeutet "eine API für alle Anbieter" in der Praxis. Jeder Anbieter hat ein eigenes Messages-Format, eigene Stop-Sequences, eigene Tool-Schemas, eine eigene Position für den System-Prompt und eine eigene Response-JSON-Form — und das AI SDK schluckt all das unter der Haube.

2. Warum das AI SDK nutzen — 3 praktische Gruende

Drei konkrete Gruende: "einfaches Wechseln, ein Drittel des Codes, Typsicherheit".

Wann das AI SDK nicht passt: 1. wenn man eine brandneue, anbieter-spezifische Funktion (Anthropic computer use usw.) direkt nach Release einsetzen muss, bevor das AI SDK sie kapselt; 2. wenn man ausschliesslich in Python arbeitet (das AI SDK ist nur TypeScript); 3. wenn eine bestehende OpenAI-SDK-Codebasis funktioniert und es keinen Grund für ein Rewrite gibt. Ausserhalb dieser Faelle ist der Default 2026 das AI SDK.

3. Start in 5 Minuten — von generateText zu streamText

Minimal-Setup in drei Schritten. Demo auf Node.js / Next.js.

# Step 1: install
npm install ai @ai-sdk/openai
# env: OPENAI_API_KEY=sk-...

# Step 2: create a file (app/api/chat/route.ts or index.ts)

// Step 3: code
import { generateText } from 'ai';
import { openai } from '@ai-sdk/openai';

const { text, usage } = await generateText({
  model: openai('gpt-5'),
  system: 'You are a careful, helpful assistant.',
  prompt: 'List three benefits of the AI SDK.',
});

console.log(text);
console.log(`tokens: ${usage.totalTokens}`);

Das ist nicht-streamend, voller Text zurück. Ausführen, und die Antwort landet in text in Sekunden. usage liefert automatisch Token-Zahlen — die Kostendisziplin aus dem Token-Spar-Artikel greift direkt.

Der Wechsel auf Streaming (Schreibmaschinen-UX) bedeutet nur, die Funktion auf streamText umzubenennen:

import { streamText } from 'ai';
import { openai } from '@ai-sdk/openai';

const result = streamText({
  model: openai('gpt-5'),
  prompt: 'List three benefits of the AI SDK.',
});

for await (const chunk of result.textStream) {
  process.stdout.write(chunk);  // emit token by token
}

Mit dem rohen OpenAI-SDK schreibt man SSE-Parsing, Chunk-Konkatenation und End-of-Stream-Erkennung von Hand (30 bis 50 Zeilen). Das AI SDK ist eine for-await-Schleife. Derselbe Code laeuft unveraendert gegen Anthropic und Gemini.

4. Strukturierte Ausgabe — Typsicheres JSON mit generateObject

Bittet man ein LLM um "JSON", erhaelt man es gelegentlich in einen Markdown-Codeblock gewickelt, mit Kommentaren versehen oder mit leise verschobener Struktur. generateObject loest das an der Wurzel: Form mit einem Zod-Schema definieren, und das AI SDK übernimmt Parsing, Validierung und Retry automatisch.

import { generateObject } from 'ai';
import { openai } from '@ai-sdk/openai';
import { z } from 'zod';

const { object } = await generateObject({
  model: openai('gpt-5'),
  schema: z.object({
    title: z.string(),
    tags: z.array(z.string()).max(5),
    sentiment: z.enum(['positive', 'neutral', 'negative']),
    summary: z.string().max(200),
  }),
  prompt: 'Analyze the article: "AI SDK 6 has..." [body]',
});

// object.title, object.tags etc are typed
console.log(object.tags);  // string[]

Der eigentliche Gewinn: "der Typ von object wird durch `z.infer<typeof schema>` bestimmt". TypeScript folgert ihn, also liefert object. in der IDE Autovervollstaendigung für title / tags / sentiment / summary. Die Laufzeit-Validierung laeuft im SDK — Schema-Verletzungen loesen automatische Retries aus. Die Vorfallsklasse "die KI hat schlechtes JSON geliefert, Parse fehlgeschlagen" verschwindet praktisch.

5. Tool calling und Agents — Das Herz von AI SDK 6

Die KI-Frontlinie 2026 sind "Tool-calling-Agents", und der größte Sprung von AI SDK 6 liegt hier. Mit tools und stopWhen bekommt man "Tool aufrufen → KI entscheidet → nächstes Tool aufrufen"-Schleifen direkt.

import { generateText, tool, stepCountIs } from 'ai';
import { anthropic } from '@ai-sdk/anthropic';
import { z } from 'zod';

const { text, steps } = await generateText({
  model: anthropic('claude-opus-4-7'),
  tools: {
    weather: tool({
      description: 'Get the weather for a city',
      inputSchema: z.object({ city: z.string() }),
      execute: async ({ city }) => {
        // real API call
        return { temp: 22, condition: 'sunny' };
      },
    }),
    convertToFahrenheit: tool({
      description: 'Convert Celsius to Fahrenheit',
      inputSchema: z.object({ celsius: z.number() }),
      execute: async ({ celsius }) => celsius * 9/5 + 32,
    }),
  },
  stopWhen: stepCountIs(5),  // cap the loop at 5 steps
  prompt: 'What is the weather in Tokyo, in Fahrenheit?',
});

Die KI sequenziert nun autonom "weather('Tokyo') → convertToFahrenheit(22)", fuehrt sie aus und integriert die Ergebnisse. steps legt die Ausfuehrungshistorie pro Schritt offen.

AI SDK 6 bietet zudem eine ToolLoopAgent-Klasse für einen objektorientierten Stil (aequivalent zu generateText + stopWhen). Sie ergaenzt Tool-Ausfuehrungs-Approval (ein Mensch bestaetigt Tool-Aufrufe vor der Ausfuehrung) und vollständige MCP-Integration (Model Context Protocol). Einen MCP-Server anbinden (siehe Was ist MCP) sind im Mai 2026 drei Zeilen.

6. React-Integration — Eine Chat-UI in 10 Zeilen mit useChat

Der andere Star des AI SDK sind die React Hooks. Mit useChat ist eine ChatGPT-aehnliche UI 10 Zeilen Code.

'use client';
import { useChat } from '@ai-sdk/react';

export default function Chat() {
  const { messages, input, handleInputChange, handleSubmit } = useChat();
  return (
    <div>
      {messages.map(m => (
        <div key={m.id}>{m.role}: {m.content}</div>
      ))}
      <form onSubmit={handleSubmit}>
        <input value={input} onChange={handleInputChange} />
      </form>
    </div>
  );
}

Server-Seite (Next.js API Route):

// app/api/chat/route.ts
import { streamText, convertToModelMessages } from 'ai';
import { openai } from '@ai-sdk/openai';

export async function POST(req: Request) {
  const { messages } = await req.json();
  const result = streamText({
    model: openai('gpt-5'),
    messages: convertToModelMessages(messages),
  });
  return result.toUIMessageStreamResponse();
}

Allein das liefert SSE-Verbindung, Message-State-Management, Loading und Fehlerbehandlung — alles automatisch. Das useChat von AI SDK 6 verarbeitet zudem nativ Tool-Approval-UI (der Nutzer klickt zur Freigabe von "soll dieses Tool laufen?"). Vue (useChat aus @ai-sdk/vue), Svelte- und Solid-Hooks sind ebenfalls dabei.

7. Anbieter wechseln — Claude, GPT, Gemini in 3 Zeilen

Die offiziell vom AI SDK unterstuetzten Hauptanbieter Stand 15. Mai 2026:

Wechsel: ein Import plus eine Modellzeile. AI SDK 5 ergaenzte ein Global-Provider-Feature, mit dem man ein Modell per String-ID angeben kann (z. B. 'openai/gpt-5'). Kombiniert mit dem LLM-Knowledge-Cutoff-Vergleich und Claude vs. ChatGPT Preisen wählen Sie Modelle nach "Kosten, Performance, regionalen Anforderungen" mit Selbstbewusstsein.

8. Drei Stolperfallen in Produktion

Das AI SDK ist praktisch, aber es gibt drei Stolperfallen, die jedes Team in Produktion trifft. Wer sie vorab kennt, vermeidet 80 % der Vorfaelle.

Eine weitere Anmerkung: das AI SDK ist "ein LLM-Adapter", nicht "ein LLM-Kosten-Wiederverkaeufer". Der API-Schlüssel jedes Anbieters liegt in Ihrer Verantwortung mit direkter Abrechnung an Sie. Wie in Was ist eine AI-API behandelt, werden Kosten direkt von OpenAI/Anthropic/Google abgerechnet. Das AI SDK selbst ist kostenlos; Sie zahlen nur für die genutzten LLMs.

Zusammenfassung

"Wie soll ich LLMs aus einer Web-App aufrufen?" — bis zum 15. Mai 2026 ist die Design-Entscheidung auf "das AI SDK, Punkt" konvergiert. Über 20 Mio. monatliche Downloads, AI SDK 6 liefert Agents, MCP, Tool-Approval, DevTools, und Sie können OpenAI/Anthropic/Google/Mistral/xAI/lokale LLMs aus derselben Codebasis aufrufen. Drei Dinge auf einmal: "Freiheit vom Vendor-Lock-in", "ein Drittel der Implementierungskosten" und "typsichere strukturierte Ausgabe".

Der Einstieg ist einfach: 1. npm install ai @ai-sdk/openai, 2. API-Schlüssel setzen, 3. eine Zeile generateText({ model, prompt }). Sobald das laeuft, schichten Sie streamText für Streaming, generateObject für JSON, tools für Agents, useChat für UI darauf. Vor der Produktion verinnerlichen Sie die drei Stolperfallen (Feature-Luecken zwischen Anbietern, Kosten bei Stream-Abbruch, Typ-Inferenz-Überlast).

Weiterfuehrend: Was ist eine AI-API (Grundlagen), KI empfiehlt Vercel, Was ist MCP, Token sparen.

FAQ

F. Muss ich auf Vercel deployen, um es zu nutzen?
A. Nein. Das AI SDK ist eine reine TypeScript-Bibliothek — Cloudflare Workers, AWS Lambda, Deno, eigener Node.js-Server, der Browser, alles funktioniert. "Von Vercel gebaut" heisst nicht "nur auf Vercel".

F. Kostet es etwas?
A. Das AI SDK selbst ist vollständig kostenlos, MIT-aehnliche Lizenz. Die Kosten sind ausschliesslich die API-Nutzung des aufgerufenen LLM-Anbieters (OpenAI/Anthropic/etc.). Das SDK schlaegt nichts auf.

F. Wie unterscheidet es sich von LangChain oder LlamaIndex?
A. Andere Rollen. Das AI SDK ist ein "duenner LLM-Aufruf-Adapter", optimiert für Web-App-Integration. LangChain ist ein vollwertiges Framework für "RAG- und Agent-Workflows". Praktische Aufteilung: "TypeScript und Integration in eine Web-UI" → AI SDK; "Python und komplexe Agent-Pipelines" → LangChain.

F. Ist die Migration von bestehendem OpenAI-SDK-Code schwer?
A. Für einfache openai.chat.completions.create-Aufrufe etwa 10 Minuten Umschreiben — durch generateText ersetzen und messages übergeben. Komplexe Funktionen (function calling, vision) brauchen eine kleine Format-Konvertierung, aber die Doku enthaelt Migration-Guides.

F. Funktioniert es mit lokalen LLMs (Ollama)?
A. Ja. Mit dem Package @ai-sdk/openai-compatible können Sie jeden OpenAI-kompatiblen API-Endpoint ansprechen — Ollama, LM Studio, vLLM, eigener Server. Der Workflow "lokal auf LLMs entwickeln, in der Cloud ausliefern" wird zu einer einzigen baseURL-Änderung.