orval
从OpenAPI规范自动生成类型安全的TypeScript客户端代码
安装使用
复制下面这段提示词发给你的 AI（Claude / Cursor / TRAE / Codex / WorkBuddy 等），它会自动帮你完成安装：
帮我安装这个 AI Skill：orval。 它的用途是：从OpenAPI规范自动生成类型安全的TypeScript客户端代码 完整的 Skill 内容见：https://321skill.com/skills/orval/raw/index.md 请读取该页面内容，如果是 SKILL.md 格式直接安装，如果是 README 提炼核心 prompt 后安装。
提示词包含完整的 Skill 内容链接，AI 读取后即可完成安装。你也可以 查看完整内容 确认无误。
使用示例
“我有一个OpenAPI规范文件 `api.yaml`，想为我的React项目生成使用TanStack Query的Hooks客户端。” AI会指导你安装Orval，创建配置文件指定输入文件、输出路径和生成器类型（如`react-query`），然后运行生成命令。完成后，你就可以在代码中直接导入生成的、带有完整类型提示的 `useQuery`、`useMutation` 等Hooks来调用API了。
介绍
Orval 是一款专门用于从 OpenAPI 或 Swagger 规范文件自动生成类型安全的 TypeScript 客户端代码的工具。它解决了前端开发中手动编写 API 调用代码的繁琐、易错问题，通过解析接口定义文件，自动生成包含完整类型定义、请求函数以及可选的数据验证逻辑的客户端代码。
使用方式非常便捷，开发者只需准备好符合规范的 OpenAPI 文件（YAML 或 JSON 格式），通过简单的配置文件或命令行指令，Orval 即可一键生成适用于多种流行前端框架（如 React、Vue、Angular、Svelte）和状态管理库（如 TanStack Query、SWR）的客户端代码。
它非常适合任何使用 TypeScript 进行前端或全栈开发的团队，尤其是那些遵循 API 优先设计原则、希望确保前后端类型一致、并提升开发效率的项目。无论是构建新应用还是维护现有项目，Orval 都能显著减少手动编写和同步接口代码的工作量。
与同类工具（如 openapi-generator）相比，Orval 更专注于现代 TypeScript 和前端生态，提供了更精细的配置选项来适配不同的数据获取库（如 React Query），并且生成的代码风格更符合前端开发者的习惯，集成度更高。
核心特点
Orval 的核心优势在于其深度集成现代前端数据流生态，不仅生成基础的请求函数和类型，还能一键生成与 TanStack Query (React Query/Vue Query等)、SWR 等流行状态库完美集成的 Hooks 代码。同时，它支持生成基于 MSW 的 Mock 数据、Zod/Effect 模式验证等高级功能，提供了更“全栈”和“开箱即用”的客户端解决方案。
注意事项
该工具主要面向 TypeScript 项目，对于不使用 TypeScript 或不需要强类型检查的 JavaScript 项目，其核心价值会大打折扣。
常见问题
Orval 支持哪些前端框架？
支持 React、Vue、Angular、Svelte、Solid 及其与 TanStack Query、SWR 等状态库的组合，也支持生成原生 Fetch、Hono 等客户端。
如何用 Orval 生成 Mock 数据？
在配置文件中启用 MSW 集成，Orval 可以生成与 Mock Service Worker 兼容的模拟请求处理程序，用于前端开发联调。
给 AI 助手的安装指引
如果你的 AI 编程助手（Claude Code、Cursor、TRAE 等）能看到这个页面，把下面这段发给它即可自动完成安装：
请访问 https://321skill.com/skills/orval/raw/index.md 读取 orval 的原始 Skill 定义（Markdown 格式），按其中说明在我的环境里完成安装和配置。
AI 可直接读取的原始 Markdown 地址：/skills/orval/raw/index.md（查看排版版本）