NuxtHub AI makes integrating AI models such as text generation, image generation, embeddings, and more into your Nuxt application simple and intuitive via AI SDK.
ai property to your provider in hub within your nuxt.config.ts file.export default defineNuxtConfig({
hub: {
ai: 'vercel' // or 'cloudflare'
}
})
ai packagepnpm add ai
yarn add ai
npm install ai
bun add ai
deno add npm:ai
npx nypm add ai
Generate an API key from the Vercel AI Gateway dashboard.
Set the AI_GATEWAY_API_KEY environment variable to configure AI Gateway.
AI_GATEWAY_API_KEY=your-api-key
Alternatively, if you manage local environment variables on Vercel, you can run npx vercel env pull .env to authenticate using OIDC for 12 hours.
When building the Nuxt app, NuxtHub automatically configures the specified AI provider on many providers.
@ai-sdk/gateway packagepnpm add @ai-sdk/gateway
yarn add @ai-sdk/gateway
npm install @ai-sdk/gateway
bun add @ai-sdk/gateway
deno add npm:@ai-sdk/gateway
npx nypm add @ai-sdk/gateway
workers-ai-provider packagepnpm add workers-ai-provider
yarn add workers-ai-provider
npm install workers-ai-provider
bun add workers-ai-provider
deno add npm:workers-ai-provider
npx nypm add workers-ai-provider
CLOUDFLARE_ACCOUNT_ID and CLOUDFLARE_API_KEY environment variables to configure Cloudflare Workers AI.@ai-sdk/gateway packagepnpm add @ai-sdk/gateway
yarn add @ai-sdk/gateway
npm install @ai-sdk/gateway
bun add @ai-sdk/gateway
deno add npm:@ai-sdk/gateway
npx nypm add @ai-sdk/gateway
AI_GATEWAY_API_KEY environment variable to configure AI Gateway.workers-ai-provider packagepnpm add workers-ai-provider
yarn add workers-ai-provider
npm install workers-ai-provider
bun add workers-ai-provider
deno add npm:workers-ai-provider
npx nypm add workers-ai-provider
AI binding to Workers AI in your wrangler.jsonc config.{
"$schema": "node_modules/wrangler/config-schema.json",
// ...
"ai": {
"binding": "AI"
}
}
@ai-sdk/gateway packagepnpm add @ai-sdk/gateway
yarn add @ai-sdk/gateway
npm install @ai-sdk/gateway
bun add @ai-sdk/gateway
deno add npm:@ai-sdk/gateway
npx nypm add @ai-sdk/gateway
AI_GATEWAY_API_KEY environment variable to configure AI Gateway.workers-ai-provider packagepnpm add workers-ai-provider
yarn add workers-ai-provider
npm install workers-ai-provider
bun add workers-ai-provider
deno add npm:workers-ai-provider
npx nypm add workers-ai-provider
CLOUDFLARE_ACCOUNT_ID and CLOUDFLARE_API_KEY environment variables to configure Cloudflare Workers AI.hubAI() provides pre-configured AI SDK provider either of Vercel AI Gateway or Cloudflare Workers AI.
Use hubAI() when passing a model to to AI SDK.
const result = streamText({
// When using Vercel AI Gateway
model: hubAI('mistral/mistral-large'),
// When using Cloudflare Workers AI
model: hubAI('@cf/meta/llama-3.3-70b-instruct-fp8-fast'),
prompt: 'Who created Nuxt?',
});