v0-dev

Compare original and translation side by side

🇺🇸

Original

English
🇨🇳

Translation

Chinese

v0 by Vercel

v0 by Vercel

You are an expert in v0 (v0.app) — Vercel's AI-powered development agent that generates production-ready code from natural language descriptions.
您是v0(v0.app)的专家——v0是Vercel推出的AI驱动开发Agent,可通过自然语言描述生成可用于生产环境的代码。

Overview

概述

v0 transforms prompts into working React/Next.js code. It supports 6M+ developers and 80K+ active teams globally. v0 operates as a universal coding agent with research, planning, debugging, and iteration capabilities.
v0可将提示词转换为可运行的React/Next.js代码。它为全球超过600万开发者和8万个活跃团队提供支持。v0是一款通用编码Agent,具备调研、规划、调试和迭代能力。

Core Capabilities

核心功能

  • Natural language → code: Describe what you want, get production React components
  • Visual input: Upload Figma designs, screenshots, or sketches → code
  • Multi-framework: Outputs React, Vue, Svelte, HTML, Markdown
  • Agentic intelligence: Research, plan, debug, iterate autonomously
  • shadcn/ui + Tailwind CSS: Default styling system
  • Full IDE: Built-in VS Code editor, terminal, and git panel in the web UI
  • 自然语言转代码:描述您的需求,即可获取可用于生产环境的React组件
  • 视觉输入:上传Figma设计稿、截图或草图,即可生成代码
  • 多框架支持:输出React、Vue、Svelte、HTML、Markdown代码
  • 智能Agent能力:自主完成调研、规划、调试和迭代
  • shadcn/ui + Tailwind CSS:默认样式系统
  • 完整IDE:Web UI中内置VS Code编辑器、终端和Git面板

CLI Usage

CLI 使用指南

Component Integration CLI (
v0
package)

组件集成CLI(
v0
包)

Install and pull v0-generated components into your Next.js project:
bash
undefined
安装并将v0生成的组件拉取到您的Next.js项目中:
bash
undefined

Initialize v0 in an existing Next.js project (one-time setup)

在现有Next.js项目中初始化v0(仅需一次设置)

npx v0@latest init
npx v0@latest init

Add a specific v0-generated component by ID

通过组件ID添加指定的v0生成组件

npx v0@latest add <component-id>
npx v0@latest add <component-id>

With pnpm

使用pnpm的方式

pnpm dlx v0@latest init pnpm dlx v0@latest add <component-id>

`v0 init` installs required dependencies (`@radix-ui/react-icons`, `clsx`, `lucide-react`) and creates a `components.json` config file.
pnpm dlx v0@latest init pnpm dlx v0@latest add <component-id>

`v0 init` 会安装所需依赖(`@radix-ui/react-icons`、`clsx`、`lucide-react`)并创建 `components.json` 配置文件。

"Add to Codebase" (Web UI → Local)

「添加到代码库」(Web UI → 本地)

From the v0.dev web interface, click the "Add to Codebase" button (terminal icon) to generate a command:
bash
npx shadcn@latest add "https://v0.dev/chat/b/<project_id>?token=<token>"
Run this in your project root to pull the entire generated project into your codebase.
在v0.dev网页界面中,点击「添加到代码库」按钮(终端图标)生成命令:
bash
npx shadcn@latest add "https://v0.dev/chat/b/<project_id>?token=<token>"
在项目根目录运行该命令,即可将整个生成的项目拉取到您的代码库中。

Typical Workflow

典型工作流

bash
undefined
bash
undefined

1. Scaffold a Next.js app

1. 搭建Next.js应用

npx create-next-app@latest --typescript --tailwind --eslint
npx create-next-app@latest --typescript --tailwind --eslint

2. Initialize v0 integration

2. 初始化v0集成

npx v0@latest init
npx v0@latest init

3. Generate a component on v0.dev, get its ID

3. 在v0.dev生成组件,获取其ID

4. Add the component locally

4. 本地添加该组件

npx v0@latest add a1B2c3d4
npx v0@latest add a1B2c3d4

5. Import and use in your app

5. 在应用中导入并使用

undefined
undefined

Project Scaffolding CLI

项目搭建CLI

bash
undefined
bash
undefined

Create a new project from v0 templates

从v0模板创建新项目

npx create-v0-sdk-app@latest my-v0-app
npx create-v0-sdk-app@latest my-v0-app

Use the v0-clone template (full v0.dev replica with auth, DB, streaming)

使用v0-clone模板(包含认证、数据库、流处理的完整v0.dev复刻版)

npx create-v0-sdk-app@latest --template v0-clone
undefined
npx create-v0-sdk-app@latest --template v0-clone
undefined

v0 SDK (Programmatic API)

v0 SDK(可编程API)

Installation

安装

bash
npm install v0-sdk
bash
npm install v0-sdk

Authentication

认证

ts
import { v0 } from 'v0-sdk'
// Automatically reads from process.env.V0_API_KEY

// Or create a custom client:
import { createClient } from 'v0-sdk'
const v0 = createClient({ apiKey: process.env.CUSTOM_V0_KEY })
ts
import { v0 } from 'v0-sdk'
// 自动从process.env.V0_API_KEY读取密钥

// 或创建自定义客户端:
import { createClient } from 'v0-sdk'
const v0 = createClient({ apiKey: process.env.CUSTOM_V0_KEY })
在以下地址获取API密钥:https://v0.app/chat/settings/keys

Create a Chat and Generate Code

创建对话并生成代码

ts
import { v0 } from 'v0-sdk'

const chat = await v0.chats.create({
  message: 'Create a responsive navbar with dark mode toggle using Tailwind',
  system: 'You are an expert React developer',
})

console.log(`Open in browser: ${chat.webUrl}`)
ts
import { v0 } from 'v0-sdk'

const chat = await v0.chats.create({
  message: '使用Tailwind创建带暗黑模式切换的响应式导航栏',
  system: '您是资深React开发者',
})

console.log(`在浏览器中打开:${chat.webUrl}`)

Full Project Workflow (Create → Chat → Deploy)

完整项目工作流(创建 → 对话 → 部署)

ts
import { v0 } from 'v0-sdk'

// Create a project
const project = await v0.projects.create({ name: 'My App' })

// Initialize a chat with existing code
const chat = await v0.chats.init({
  type: 'files',
  files: [{ name: 'App.tsx', content: existingCode }],
  projectId: project.id,
})

// Send follow-up instructions
await v0.chats.sendMessage({
  chatId: chat.id,
  message: 'Add a sidebar with navigation links and a user avatar',
})

// Deploy when ready
const deployment = await v0.deployments.create({
  projectId: project.id,
  chatId: chat.id,
  versionId: chat.latestVersion.id,
})

console.log(`Live at: ${deployment.url}`)
ts
import { v0 } from 'v0-sdk'

// 创建项目
const project = await v0.projects.create({ name: 'My App' })

// 用现有代码初始化对话
const chat = await v0.chats.init({
  type: 'files',
  files: [{ name: 'App.tsx', content: existingCode }],
  projectId: project.id,
})

// 发送后续指令
await v0.chats.sendMessage({
  chatId: chat.id,
  message: '添加带导航链接和用户头像的侧边栏',
})

// 准备就绪后部署
const deployment = await v0.deployments.create({
  projectId: project.id,
  chatId: chat.id,
  versionId: chat.latestVersion.id,
})

console.log(`已上线:${deployment.url}`)

Download Generated Code

下载生成的代码

ts
// Download files from a specific chat version
const files = await v0.chats.downloadVersion({
  chatId: chat.id,
  versionId: chat.latestVersion.id,
})
ts
// 从指定对话版本下载文件
const files = await v0.chats.downloadVersion({
  chatId: chat.id,
  versionId: chat.latestVersion.id,
})

SDK Method Reference

SDK方法参考

Chats:
  • v0.chats.create(params)
    — Create a new chat
  • v0.chats.sendMessage(params)
    — Send a message to an existing chat
  • v0.chats.getById(params)
    — Retrieve a specific chat
  • v0.chats.update(params)
    — Update chat properties
  • v0.chats.findVersions(params)
    — List all versions of a chat
  • v0.chats.getVersion(params)
    — Retrieve a specific version
  • v0.chats.updateVersion(params)
    — Update files within a version
  • v0.chats.downloadVersion(params)
    — Download files for a version
  • v0.chats.resume(params)
    — Resume processing of a message
Projects:
  • v0.projects.create(params)
    — Create a new project
  • v0.projects.getById(params)
    — Retrieve a project
  • v0.projects.update(params)
    — Update a project
  • v0.projects.find()
    — List all projects
  • v0.projects.assign(params)
    — Assign a chat to a project
  • v0.projects.getByChatId(params)
    — Get project by chat ID
  • v0.projects.createEnvVars(params)
    — Create env vars for a project
Deployments:
  • v0.deployments.create(params)
    — Create deployment from a chat version
  • v0.deployments.getById(params)
    — Get deployment details
  • v0.deployments.delete(params)
    — Delete a deployment
  • v0.deployments.find(params)
    — List deployments
  • v0.deployments.findLogs(params)
    — Get deployment logs
对话相关:
  • v0.chats.create(params)
    — 创建新对话
  • v0.chats.sendMessage(params)
    — 向现有对话发送消息
  • v0.chats.getById(params)
    — 获取指定对话
  • v0.chats.update(params)
    — 更新对话属性
  • v0.chats.findVersions(params)
    — 列出对话的所有版本
  • v0.chats.getVersion(params)
    — 获取指定对话版本
  • v0.chats.updateVersion(params)
    — 更新版本内的文件
  • v0.chats.downloadVersion(params)
    — 下载版本对应的文件
  • v0.chats.resume(params)
    — 恢复消息处理
项目相关:
  • v0.projects.create(params)
    — 创建新项目
  • v0.projects.getById(params)
    — 获取项目
  • v0.projects.update(params)
    — 更新项目
  • v0.projects.find()
    — 列出所有项目
  • v0.projects.assign(params)
    — 将对话分配给项目
  • v0.projects.getByChatId(params)
    — 通过对话ID获取项目
  • v0.projects.createEnvVars(params)
    — 为项目创建环境变量
部署相关:
  • v0.deployments.create(params)
    — 从对话版本创建部署
  • v0.deployments.getById(params)
    — 获取部署详情
  • v0.deployments.delete(params)
    — 删除部署
  • v0.deployments.find(params)
    — 列出部署
  • v0.deployments.findLogs(params)
    — 获取部署日志

REST API

REST API

Base URL:
https://api.v0.dev/v1
Auth:
Authorization: Bearer <V0_API_KEY>
MethodEndpointDescription
GET
/v1/projects
List projects
POST
/v1/projects
Create project
GET
/v1/projects/:id
Get project
PUT
/v1/projects/:id
Update project
DELETE
/v1/projects/:id
Delete project
POST
/v1/chats
Create/initialize chat
GET
/v1/chats/:id/messages
Get messages
POST
/v1/chats/:id/messages
Send message
POST
/v1/deployments
Create deployment
基础URL:
https://api.v0.dev/v1
认证方式:
Authorization: Bearer <V0_API_KEY>
方法端点描述
GET
/v1/projects
列出项目
POST
/v1/projects
创建项目
GET
/v1/projects/:id
获取项目
PUT
/v1/projects/:id
更新项目
DELETE
/v1/projects/:id
删除项目
POST
/v1/chats
创建/初始化对话
GET
/v1/chats/:id/messages
获取消息
POST
/v1/chats/:id/messages
发送消息
POST
/v1/deployments
创建部署

Rate Limits

速率限制

  • API Requests: 10,000/day
  • Chat Messages: 1,000/day
  • Deployments: 100/day
  • File Uploads: 1 GB/day
  • Projects per account: 100
  • API请求:10,000次/天
  • 对话消息:1,000条/天
  • 部署:100次/天
  • 文件上传:1 GB/天
  • 每个账户的项目数量:100个

Available Models

可用模型

  • v0-1.5-md
    — Everyday tasks and UI generation
  • v0-1.5-lg
    — Advanced reasoning
  • v0-1.0-md
    — Legacy model
  • v0-1.5-md
    — 日常任务与UI生成
  • v0-1.5-lg
    — 高级推理
  • v0-1.0-md
    — 旧版模型

AI SDK Integration

AI SDK集成

Using v0 as an AI Provider

将v0作为AI提供商

bash
npm i @ai-sdk/vercel
ts
import { vercel } from '@ai-sdk/vercel'
import { generateText } from 'ai'

const { text } = await generateText({
  model: vercel('v0-1.5-md'),
  prompt: 'Create a login form with email and password fields',
})
bash
npm i @ai-sdk/vercel
ts
import { vercel } from '@ai-sdk/vercel'
import { generateText } from 'ai'

const { text } = await generateText({
  model: vercel('v0-1.5-md'),
  prompt: '创建带邮箱和密码字段的登录表单',
})

v0 AI Tools (Agent Integration)

v0 AI工具(Agent集成)

Use v0's full capabilities as tools within an AI SDK agent:
bash
npm install @v0-sdk/ai-tools ai
ts
import { generateText } from 'ai'
import { openai } from '@ai-sdk/openai'
import { v0Tools } from '@v0-sdk/ai-tools'

const result = await generateText({
  model: openai('gpt-5.2'),
  prompt: 'Create a new React dashboard project with charts and a data table',
  tools: v0Tools({ apiKey: process.env.V0_API_KEY }),
})
For granular control, import specific tool sets:
ts
import { createChatTools, createProjectTools, createDeploymentTools } from '@v0-sdk/ai-tools'
The
v0Tools
export includes 20+ tools:
createChat
,
sendMessage
,
getChat
,
updateChat
,
deleteChat
,
favoriteChat
,
forkChat
,
listChats
,
createProject
,
getProject
,
updateProject
,
listProjects
,
assignChatToProject
,
createEnvironmentVariables
,
createDeployment
,
getDeployment
,
deleteDeployment
,
listDeployments
,
getDeploymentLogs
.
在AI SDK Agent中使用v0的完整功能作为工具:
bash
npm install @v0-sdk/ai-tools ai
ts
import { generateText } from 'ai'
import { openai } from '@ai-sdk/openai'
import { v0Tools } from '@v0-sdk/ai-tools'

const result = await generateText({
  model: openai('gpt-5.2'),
  prompt: '创建带图表和数据表的新React仪表盘项目',
  tools: v0Tools({ apiKey: process.env.V0_API_KEY }),
})
如需精细控制,可导入特定工具集:
ts
import { createChatTools, createProjectTools, createDeploymentTools } from '@v0-sdk/ai-tools'
v0Tools
导出包含20+个工具:
createChat
sendMessage
getChat
updateChat
deleteChat
favoriteChat
forkChat
listChats
createProject
getProject
updateProject
listProjects
assignChatToProject
createEnvironmentVariables
createDeployment
getDeployment
deleteDeployment
listDeployments
getDeploymentLogs

MCP Server

MCP服务器

Connect v0 to any MCP-compatible IDE (Cursor, Claude Desktop, etc.):
json
{
  "mcpServers": {
    "v0": {
      "command": "npx",
      "args": [
        "mcp-remote",
        "https://mcp.v0.dev",
        "--header",
        "Authorization: Bearer ${V0_API_KEY}"
      ]
    }
  }
}
Exposes 4 tools: create chat, get chat info, find chats, send messages.
将v0连接到任何兼容MCP的IDE(Cursor、Claude Desktop等):
json
{
  "mcpServers": {
    "v0": {
      "command": "npx",
      "args": [
        "mcp-remote",
        "https://mcp.v0.dev",
        "--header",
        "Authorization: Bearer ${V0_API_KEY}"
      ]
    }
  }
}
提供4个工具:创建对话、获取对话信息、查找对话、发送消息。

GitHub Integration

GitHub集成

Setup

设置

  1. In the v0 chat sidebar → Git section → click Connect
  2. Select GitHub account/org scope and repository name
  3. Click Create Repository — links chat to a new private GitHub repo
  4. A Vercel deployment is automatically created
  1. 在v0对话侧边栏 → Git 区域 → 点击 连接
  2. 选择GitHub账户/组织范围和仓库名称
  3. 点击 创建仓库 — 将对话关联到新的私有GitHub仓库
  4. 自动创建Vercel部署

Branch Behavior (Automatic)

分支行为(自动)

  • Every chat creates a new branch (e.g.,
    v0/main-e7bad8e4
    )
  • Every prompt that changes code automatically commits and pushes
  • You never work directly on
    main
  • 每个对话都会创建新分支(例如:
    v0/main-e7bad8e4
  • 每次修改代码的提示词都会自动提交并推送
  • 您永远不会直接在
    main
    分支上工作

PR Workflow

PR工作流

  1. Click the Publish button (shows PR icon when GitHub-connected)
  2. Select Open PR — creates PR from
    v0/main-abc123
    main
  3. Review in the GitHub modal or on GitHub.com
  4. Merge the PR → closes the chat permanently
  5. Every PR gets a Preview Deployment; merging triggers Production Deployment
  1. 点击 发布 按钮(连接GitHub后会显示PR图标)
  2. 选择 打开PR — 创建从
    v0/main-abc123
    main
    的PR
  3. 在GitHub模态框或GitHub.com中审核
  4. 合并PR → 永久关闭对话
  5. 每个PR都会获得预览部署;合并会触发生产环境部署

Importing Existing Repos

导入现有仓库

  1. In v0 prompt bar → click
    +
    → "Import from GitHub"
  2. v0 reads your existing codebase and env vars from Vercel
  3. Iterate with prompts; all changes committed to a new branch
  1. 在v0提示栏 → 点击
    +
    → 「从GitHub导入」
  2. v0会从Vercel读取您的现有代码库和环境变量
  3. 通过提示词迭代;所有更改都会提交到新分支

Prompt Engineering Tips

提示词工程技巧

1. Be Specific About Design

1. 明确设计细节

Weak:  "Build a dashboard"
Strong: "Build a support ticket dashboard. Mobile-first, light theme, high
        contrast. Color code: red for urgent, yellow for medium, green for low.
        Show agent status badges. Maximum 2 columns on mobile."
弱提示:  "搭建一个仪表盘"
强提示: "搭建一个支持工单仪表盘。移动端优先,浅色主题,高对比度。颜色编码:红色表示紧急,黄色表示中等,绿色表示低优先级。显示客服状态徽章。移动端最多2列布局。"

2. Specify Your Tech Stack

2. 指定技术栈

"Build a real-time chat app using: Next.js 16 with App Router,
Socket.io for messaging, Vercel Postgres for storage,
NextAuth.js for authentication."
"使用以下技术搭建实时聊天应用:Next.js 16(App Router)、
Socket.io(消息通信)、Vercel Postgres(存储)、
NextAuth.js(认证)。"

3. Define User Roles

3. 定义用户角色

"Create a team collaboration tool with admin, manager, and member
roles, task assignment, progress tracking, and file sharing."
"创建带管理员、经理和成员角色的团队协作工具,支持任务分配、进度跟踪和文件共享。"

4. Queue Multiple Prompts

4. 批量排队提示词

You can queue up to 10 prompts while v0 is still generating:
  1. "Create the base layout with navigation"
  2. "Add authentication with NextAuth"
  3. "Connect the database and add CRUD operations"
  4. "Add a settings page with dark mode toggle"
当v0仍在生成代码时,您最多可排队10个提示词:
  1. "创建带导航的基础布局"
  2. "添加NextAuth认证"
  3. "连接数据库并添加CRUD操作"
  4. "添加带暗黑模式切换的设置页面"

5. Specify Error and Empty States

5. 指定错误与空状态

"Add comprehensive error handling for network failures, invalid
input, and empty states with helpful recovery suggestions."
"为网络故障、无效输入和空状态添加全面的错误处理,并提供有用的恢复建议。"

6. Use Visual Selection for Precision

6. 使用视觉选择提高精度

Click a specific element in the preview before typing to target exactly what you want to change. Eliminates ambiguity for multi-instance components.
在输入提示词前点击预览中的特定元素,精准定位您想要修改的内容。消除多实例组件的歧义。

7. Use Design Mode vs Prompts

7. 区分设计模式与提示词

  • Prompts: Structural changes, adding features, wiring up logic
  • Design Mode (click element → adjust): Colors, spacing, typography tweaks
  • 提示词:结构更改、添加功能、逻辑关联
  • 设计模式(点击元素→调整):颜色、间距、排版微调

8. v0's Default Output Stack

8. v0默认输出栈

When no framework is specified, v0 generates:
  • React with JSX + TypeScript
  • Tailwind CSS
  • shadcn/ui components
  • Lucide React icons
  • Complete, copy-paste-ready code (never partial stubs)
未指定框架时,v0会生成:
  • React(JSX + TypeScript)
  • Tailwind CSS
  • shadcn/ui组件
  • Lucide React图标
  • 完整的可直接复制粘贴的代码(绝不会生成部分代码片段)

Design Normalization for v0 Output

v0输出的设计规范化

v0 is strongest when you specify both structure and aesthetic direction. For Vercel-stack projects, include guidance like: use shadcn/ui primitives, use Geist fonts, default to dark mode, use zinc/neutral tokens, avoid generic card grids. After importing v0 code, normalize it: replace ad-hoc controls with shadcn components, collapse repeated card grids into stronger patterns, align typography to Geist, remove mixed radii and decorative effects.
当您同时指定结构和美学方向时,v0的表现最佳。对于Vercel栈项目,可包含如下指导:使用shadcn/ui原语、使用Geist字体、默认暗黑模式、使用zinc/neutral令牌、避免通用卡片网格。导入v0代码后进行规范化:将临时控件替换为shadcn组件、将重复的卡片网格整合为更简洁的模式、将排版对齐到Geist、移除混合圆角和装饰效果。

Integration Patterns

集成模式

Pattern 1: Generate Components, Import Locally

模式1:生成组件,本地导入

Best for adding individual UI components to an existing app.
bash
npx v0@latest init
npx v0@latest add <component-id>
Then import the component:
tsx
import { DataTable } from '@/components/data-table'

export default function DashboardPage() {
  return <DataTable data={rows} columns={columns} />
}
最适合为现有应用添加单个UI组件。
bash
npx v0@latest init
npx v0@latest add <component-id>
然后导入组件:
tsx
import { DataTable } from '@/components/data-table'

export default function DashboardPage() {
  return <DataTable data={rows} columns={columns} />
}

Pattern 2: GitHub Round-Trip

模式2:GitHub往返工作流

Best for iterating on a full feature branch with non-engineers.
  1. Import repo into v0 from GitHub
  2. Non-engineer iterates via prompts
  3. v0 auto-commits each change to a feature branch
  4. Engineer reviews the PR, merges
最适合与非工程师协作迭代完整功能分支。
  1. 从GitHub导入仓库到v0
  2. 非工程师通过提示词迭代
  3. v0自动将每次更改提交到功能分支
  4. 工程师审核PR并合并

Pattern 3: SDK Automation

模式3:SDK自动化

Best for CI/CD pipelines or programmatic component generation.
ts
import { v0 } from 'v0-sdk'

// Generate a component from a design spec
const chat = await v0.chats.create({
  message: `Create a pricing table component with these tiers:
    - Free: 0/mo, 1 project, community support
    - Pro: $20/mo, unlimited projects, priority support
    - Enterprise: Custom, SLA, dedicated support`,
})

// Wait for generation, then download
const files = await v0.chats.downloadVersion({
  chatId: chat.id,
  versionId: chat.latestVersion.id,
})
最适合CI/CD流水线或可编程组件生成。
ts
import { v0 } from 'v0-sdk'

// 根据设计规范生成组件
const chat = await v0.chats.create({
  message: `创建带以下套餐的定价表组件:
    - 免费版:0元/月,1个项目,社区支持
    - 专业版:20美元/月,无限项目,优先支持
    - 企业版:定制价格,SLA保障,专属支持`,
})

// 等待生成完成后下载
const files = await v0.chats.downloadVersion({
  chatId: chat.id,
  versionId: chat.latestVersion.id,
})

Pattern 4: v0 as AI Agent Tool

模式4:将v0作为AI Agent工具

Best for autonomous agents that need to generate and deploy UI.
ts
import { Agent } from 'ai'
import { v0Tools } from '@v0-sdk/ai-tools'

const agent = new Agent({
  model: openai('gpt-5.2'),
  tools: {
    ...v0Tools({ apiKey: process.env.V0_API_KEY }),
    // ... other tools
  },
  system: 'You are a full-stack developer. Use v0 to generate UI components.',
})

const { text } = await agent.generateText({
  prompt: 'Create a dashboard for our analytics data and deploy it',
})
最适合需要生成并部署UI的自主Agent。
ts
import { Agent } from 'ai'
import { v0Tools } from '@v0-sdk/ai-tools'

const agent = new Agent({
  model: openai('gpt-5.2'),
  tools: {
    ...v0Tools({ apiKey: process.env.V0_API_KEY }),
    // ... 其他工具
  },
  system: '您是全栈开发者。使用v0生成UI组件。',
})

const { text } = await agent.generateText({
  prompt: '为我们的分析数据创建仪表盘并部署',
})

Built-in Integrations

内置集成

v0 has native support for these services in its sandbox:
  • Databases: Neon (PostgreSQL), Supabase, Upstash Redis, Vercel Blob
  • AI: OpenAI, Anthropic, Groq, Grok, fal, Deep Infra (via Vercel AI Gateway)
  • Payments: Stripe
  • External APIs: Twilio, and others via the "Vars" panel
v0在沙箱中原生支持以下服务:
  • 数据库:Neon(PostgreSQL)、Supabase、Upstash Redis、Vercel Blob
  • AI:OpenAI、Anthropic、Groq、Grok、fal、Deep Infra(通过Vercel AI Gateway)
  • 支付:Stripe
  • 外部API:Twilio,以及通过「Vars」面板的其他服务

Limitations

局限性

  • Best for UI components and layouts (~20% of a full application)
  • Backend, database, auth, and AI integration require separate implementation or explicit prompting
  • Generated code may need manual fixes for complex business logic
  • Enterprise-level scalability needs additional architecture review
  • shadcn/ui is the primary component library; other libraries require explicit prompting
  • 最适合UI组件和布局(约占完整应用的20%)
  • 后端、数据库、认证和AI集成需要单独实现或明确提示
  • 生成的代码可能需要手动修复复杂的业务逻辑
  • 企业级可扩展性需要额外的架构评审
  • shadcn/ui是主要组件库;使用其他库需要明确提示

Official Documentation

官方文档