Studio 的关系视图、导出与 VS Code 集成

关系视图

Studio 提供了可视化的 ER 图 / 数据模型关系图：

• 点击左侧栏 model 列表底部的"关系"按钮（或某个 model 的关联字段上的展开图标）
• Studio 会画出模型之间的关系线：一对多显示 1→N、多对多显示双向 N↔N
• 这是理解数据库结构最直观的方式——尤其对新人或接手老项目时

关系图会根据你的 Schema 定义自动生成，不需要手动维护。Schema 改了后 Studio 刷新一下就能看到更新后的图。

多标签页并行

Studio 支持同时打开多个 model 的表格。每个 model 标签页是独立的：

• 各自保留筛选、排序、滚动位置
• 可以一边编辑 User 一边对照 Post，不用来回切换
• 标签页之间是浅链接——刷新浏览器会丢

导出数据

快速导出

顶栏的导出按钮可以把当前 model（带筛选条件后的结果）导出成 CSV 或 JSON：

• 导出的是当前视图显示的数据（如果有筛选就只导出筛选后的数据）
• CSV 编码为 UTF-8（Excel 打开可能需要 BOM，但 Studio 标准导出不带）
• JSON 格式与 Prisma Client 返回的结构一致（关系字段会被展开成嵌套对象）

导出带关联

如果你在 Studio 里展开了关联数据（include 效果），导出时可以选择是否包含关联字段。

Studio 的非开源部分

Prisma Studio 是 Prisma ORM 三件套里唯一非开源的组件。但：

• 可以免费本地使用（npx prisma studio 不需要登录、不需要付费）
• 不能自行改源码或重新分发
• 商业功能（团队协作、云端部署 Studio）在 Prisma Console 里提供，需要付费计划

Prisma Client 和 Prisma Migrate 都是 MIT 协议开源的。

VS Code 集成

Prisma VS Code 扩展 + Studio

如果你装了 Prisma 的 VS Code 扩展，在 schema.prisma 文件里：

• 右键菜单里有 "Open Studio" 直接从编辑器启动 Studio
• 可以在编辑器里看到 Studio 连接状态
• Schema 变化时 Studio 会提示刷新

Schema 语法检查

VS Code 扩展提供实时语法和类型检查：

• 红色波浪线：Schema 语法错误或类型不匹配
• 悬停提示：字段类型信息、默认值说明
• 自动补全：输入 @ 或 @@ 时提示可用属性
• 格式化：Ctrl+Shift+I 自动按 Prisma 标准格式对齐

这个扩展在 Schema 复杂起来后（关系多了、枚举多了）尤其有价值——手写出错的概率大大降低。

Studio 嵌入到自己的应用

Prisma 还提供了把 Studio 嵌入到你自己的 Web 应用里的能力。如果你的用户需要数据编辑功能（比如管理后台、CMS），可以在 Next.js API Route 或 Express 路由里代理 Studio：

// Next.js API Route: /api/studio.ts
import { PrismaStudioMiddleware } from '@prisma/studio-server'
import { PrismaClient } from '@prisma/client'

const prisma = new PrismaClient()
const studio = new PrismaStudioMiddleware({ prisma })

export default studio.handle.bind(studio)

注意这个功能目前仍在演进中，以官方文档为准。另外嵌入 Studio 等于把数据编辑权限开放给能访问这个路由的人，一定要加鉴权中间件。