v0-dev
Compare original and translation side by side
🇺🇸
Original
English🇨🇳
Translation
Chinesev0 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)
v0组件集成CLI(v0
包)
v0Install and pull v0-generated components into your Next.js project:
bash
undefined安装并将v0生成的组件拉取到您的Next.js项目中:
bash
undefinedInitialize 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
undefinedbash
undefined1. 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. 在应用中导入并使用
undefinedundefinedProject Scaffolding CLI
项目搭建CLI
bash
undefinedbash
undefinedCreate 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
undefinednpx create-v0-sdk-app@latest --template v0-clone
undefinedv0 SDK (Programmatic API)
v0 SDK(可编程API)
Installation
安装
bash
npm install v0-sdkbash
npm install v0-sdkAuthentication
认证
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 })Get your API key at: https://v0.app/chat/settings/keys
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:
- — Create a new chat
v0.chats.create(params) - — Send a message to an existing chat
v0.chats.sendMessage(params) - — Retrieve a specific chat
v0.chats.getById(params) - — Update chat properties
v0.chats.update(params) - — List all versions of a chat
v0.chats.findVersions(params) - — Retrieve a specific version
v0.chats.getVersion(params) - — Update files within a version
v0.chats.updateVersion(params) - — Download files for a version
v0.chats.downloadVersion(params) - — Resume processing of a message
v0.chats.resume(params)
Projects:
- — Create a new project
v0.projects.create(params) - — Retrieve a project
v0.projects.getById(params) - — Update a project
v0.projects.update(params) - — List all projects
v0.projects.find() - — Assign a chat to a project
v0.projects.assign(params) - — Get project by chat ID
v0.projects.getByChatId(params) - — Create env vars for a project
v0.projects.createEnvVars(params)
Deployments:
- — Create deployment from a chat version
v0.deployments.create(params) - — Get deployment details
v0.deployments.getById(params) - — Delete a deployment
v0.deployments.delete(params) - — List deployments
v0.deployments.find(params) - — Get deployment logs
v0.deployments.findLogs(params)
对话相关:
- — 创建新对话
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) - — 通过对话ID获取项目
v0.projects.getByChatId(params) - — 为项目创建环境变量
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:
Auth:
https://api.v0.dev/v1Authorization: Bearer <V0_API_KEY>| Method | Endpoint | Description |
|---|---|---|
| | List projects |
| | Create project |
| | Get project |
| | Update project |
| | Delete project |
| | Create/initialize chat |
| | Get messages |
| | Send message |
| | Create deployment |
基础URL:
认证方式:
https://api.v0.dev/v1Authorization: Bearer <V0_API_KEY>| 方法 | 端点 | 描述 |
|---|---|---|
| | 列出项目 |
| | 创建项目 |
| | 获取项目 |
| | 更新项目 |
| | 删除项目 |
| | 创建/初始化对话 |
| | 获取消息 |
| | 发送消息 |
| | 创建部署 |
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
可用模型
- — Everyday tasks and UI generation
v0-1.5-md - — Advanced reasoning
v0-1.5-lg - — Legacy model
v0-1.0-md
- — 日常任务与UI生成
v0-1.5-md - — 高级推理
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/vercelts
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/vercelts
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 aits
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 export includes 20+ tools: , , , , , , , , , , , , , , , , , , .
v0ToolscreateChatsendMessagegetChatupdateChatdeleteChatfavoriteChatforkChatlistChatscreateProjectgetProjectupdateProjectlistProjectsassignChatToProjectcreateEnvironmentVariablescreateDeploymentgetDeploymentdeleteDeploymentlistDeploymentsgetDeploymentLogs在AI SDK Agent中使用v0的完整功能作为工具:
bash
npm install @v0-sdk/ai-tools aits
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'v0ToolscreateChatsendMessagegetChatupdateChatdeleteChatfavoriteChatforkChatlistChatscreateProjectgetProjectupdateProjectlistProjectsassignChatToProjectcreateEnvironmentVariablescreateDeploymentgetDeploymentdeleteDeploymentlistDeploymentsgetDeploymentLogsMCP 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
设置
- In the v0 chat sidebar → Git section → click Connect
- Select GitHub account/org scope and repository name
- Click Create Repository — links chat to a new private GitHub repo
- A Vercel deployment is automatically created
- 在v0对话侧边栏 → Git 区域 → 点击 连接
- 选择GitHub账户/组织范围和仓库名称
- 点击 创建仓库 — 将对话关联到新的私有GitHub仓库
- 自动创建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工作流
- Click the Publish button (shows PR icon when GitHub-connected)
- Select Open PR — creates PR from →
v0/main-abc123main - Review in the GitHub modal or on GitHub.com
- Merge the PR → closes the chat permanently
- Every PR gets a Preview Deployment; merging triggers Production Deployment
- 点击 发布 按钮(连接GitHub后会显示PR图标)
- 选择 打开PR — 创建从到
v0/main-abc123的PRmain - 在GitHub模态框或GitHub.com中审核
- 合并PR → 永久关闭对话
- 每个PR都会获得预览部署;合并会触发生产环境部署
Importing Existing Repos
导入现有仓库
- In v0 prompt bar → click → "Import from GitHub"
+ - v0 reads your existing codebase and env vars from Vercel
- Iterate with prompts; all changes committed to a new branch
- 在v0提示栏 → 点击→ 「从GitHub导入」
+ - v0会从Vercel读取您的现有代码库和环境变量
- 通过提示词迭代;所有更改都会提交到新分支
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:
- "Create the base layout with navigation"
- "Add authentication with NextAuth"
- "Connect the database and add CRUD operations"
- "Add a settings page with dark mode toggle"
当v0仍在生成代码时,您最多可排队10个提示词:
- "创建带导航的基础布局"
- "添加NextAuth认证"
- "连接数据库并添加CRUD操作"
- "添加带暗黑模式切换的设置页面"
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.
- Import repo into v0 from GitHub
- Non-engineer iterates via prompts
- v0 auto-commits each change to a feature branch
- Engineer reviews the PR, merges
最适合与非工程师协作迭代完整功能分支。
- 从GitHub导入仓库到v0
- 非工程师通过提示词迭代
- v0自动将每次更改提交到功能分支
- 工程师审核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是主要组件库;使用其他库需要明确提示