Vercel

Run inferences on Clarifai models using Vercel

---

Vercel offers a TypeScript toolkit called the AI SDK, which streamlines integration with language models in modern web applications.

The SDK supports the OpenAI Compatible Provider package that enables seamless interaction with any OpenAI-compatible API — including Clarifai’s OpenAI-compatible endpoint.

Prerequisites

Install Packages

Install the Vercel AI SDK (ai) and the OpenAI Provider package for the SDK (@ai-sdk/openai-compatible).

Bash

  npm install ai @ai-sdk/openai-compatible  

Get a PAT Key

You need a PAT (Personal Access Token) key to authenticate your connection to the Clarifai platform. You can generate the PAT key in your personal settings page by navigating to the Security section.

You can then set the PAT as an environment variable using CLARIFAI_PAT:

Unix-Like Systems

 export CLARIFAI_PAT=YOUR_PERSONAL_ACCESS_TOKEN_HERE 

Windows

 set CLARIFAI_PAT=YOUR_PERSONAL_ACCESS_TOKEN_HERE 

Get a Clarifai Model

Go to the Clarifai Community platform and select the model you want to use for making predictions.

Some Clarifai models that support Vercel AI SDK, and their capabilities

Model	Image Input	Tool Usage	Tool Streaming
DeepSeek R1 0528 Qwen3 8B	✅	✅	✅
Llama 3.2 3B Instruct	✅	✅	✅
claude Sonnet 4	✅	✅	✅
Qwen3 14B	✅	✅	✅
Devstral Small 2505.gguf 4bit	✅	✅	✅
grok 3	❌	✅	✅
gpt 4o	✅	✅	✅
gpt 4.1	✅	✅	✅
gemini 2.5 Flash	✅	✅	✅
claude 3.5 Haiku	✅	✅	✅
Qwen3 30B A3B GGUF	✅	✅	✅
gemini 2.0 Flash	✅	✅	✅
gemma 3 12b It	✅	✅	✅
Phi 4 Reasoning Plus	✅	✅	✅
phi 4 Mini Instruct	✅	✅	✅
Qwen2.5 VL 7B Instruct	✅	❌	❌
phi 4	✅	✅	✅
grok 2 Vision 1212	✅	✅	✅
grok 2 1212	❌	✅	✅
QwQ 32B AWQ	✅	✅	✅
gemini 2.0 Flash Lite	✅	✅	✅
claude Opus 4	✅	✅	✅
o4 Mini	✅	✅	✅
o3	✅	✅	✅
MiniCPM-o 2.6 Language	✅	❌	❌
DeepSeek R1 Distill Qwen 7B	✅	❌	❌
Qwen2.5 Coder 7B Instruct	✅	✅	✅

Generating Text

Here's an example of how you can generate text using the Vercel AI SDK with a Clarifai-hosted model.

TypeScript

import { createOpenAICompatible } from "@ai-sdk/openai-compatible";
import { generateText } from "ai";

const clarifai = createOpenAICompatible({
  baseURL: "https://api.clarifai.com/v2/ext/openai/v1",
  apiKey: process.env.CLARIFAI_PAT,
});

const model = clarifai(
  "https://clarifai.com/anthropic/completion/models/claude-sonnet-4",
);

const { text } = await generateText({
  model,
  messages: [
    { role: "system", content: "You are a helpful assistant." },
    { role: "user", content: "What is photosynthesis?" },
  ],
});

console.log(text);

Example Output

Photosynthesis is the process by which plants, algae, and some bacteria convert light energy (usually from sunlight) into chemical energy in the form of glucose (sugar). This process is essential for life on Earth as it produces the oxygen we breathe and forms the base of most food chains.

## The Basic Process

**Overall equation:**
6CO₂ + 6H₂O + light energy → C₆H₁₂O₆ + 6O₂

This means carbon dioxide + water + light energy → glucose + oxygen

## Two Main Stages

1. **Light-dependent reactions** (occur in the thyloids):
   - Chlorophyll absorbs light energy
   - Water molecules are split, releasing oxygen
   - Energy is captured and stored in molecules like ATP

2. **Light-independent reactions/Calvin cycle** (occur in the stroma):
   - Carbon dioxide is "fixed" into organic molecules
   - Glucose is produced using the energy from stage 1

## Why It Matters

- **Produces oxygen**: Nearly all oxygen in our atmosphere comes from photosynthesis
- **Creates food**: Forms the foundation of food webs
- **Removes CO₂**: Helps regulate atmospheric carbon dioxide levels
- **Stores energy**: Converts solar energy into chemical energy that powers most life on Earth

Photosynthesis primarily takes place in the leaves of plants, specifically in specialized cell structures called chloroplasts, which contain the green pigment chlorophyll.

Streaming

You can use the Vercel AI SDK to stream responses.

TypeScript

import { createOpenAICompatible } from "@ai-sdk/openai-compatible";
import { streamText } from "ai";

const clarifai = createOpenAICompatible({
  baseURL: "https://api.clarifai.com/v2/ext/openai/v1",
  apiKey: process.env.CLARIFAI_PAT,
});

const model = clarifai(
  "https://clarifai.com/anthropic/completion/models/claude-sonnet-4",
);

const stream = streamText({
  model,
  messages: [
    { role: "system", content: "You are a helpful assistant." },
    { role: "user", content: "What is photosynthesis?" },
  ],
});

for await (const part of stream.textStream) {
  console.log(part);
}

Tool Calling

The Vercel AI SDK supports tool calling.

Note: To run this example, install the Zod validation library: npm install zod.

TypeScript

import { createOpenAICompatible } from "@ai-sdk/openai-compatible";
import { generateText, tool } from "ai";
import { z } from "zod";

const clarifai = createOpenAICompatible({
  baseURL: "https://api.clarifai.com/v2/ext/openai/v1",
  apiKey: process.env.CLARIFAI_PAT,
});

const model = clarifai(
  "https://clarifai.com/anthropic/completion/models/claude-sonnet-4",
);

const result = await generateText({
  model,
  tools: {
    weather: tool({
      description: "Get the weather in a location",
      parameters: z.object({
        location: z.string().describe("The location to get the weather for"),
      }),
      execute: async ({ location }) => ({
        location,
        temperature: 72 + Math.floor(Math.random() * 21) - 10,
      }),
    }),
    cityAttractions: tool({
      parameters: z.object({ city: z.string() }),
    }),
  },
  prompt:
    "What is the weather in San Francisco and what attractions should I visit?",
});

console.log(result.toolResults);