分类

OpenAPI 转 TypeScript 类型生成器

将 OpenAPI 或 Swagger 的 JSON/YAML 规范转换为 TypeScript 接口类型、请求参数类型和响应类型,并支持输出格式与命名风格配置

示例结果

1 个示例

从 OpenAPI 规范生成扁平 API 类型

将小型 OpenAPI 文档转换为扁平导出的 TypeScript 接口和端点契约类型

export interface User {
  id: string;
  name: string;
}

export interface GetUserPath {
  id: string;
}

export type GetUserResponse = { status: "200"; data: User };
查看输入参数
{ "specInput": "openapi: 3.0.0\ninfo:\n title: User API\n version: 1.0.0\npaths:\n /users/{id}:\n get:\n operationId: getUser\n parameters:\n - in: path\n name: id\n required: true\n schema:\n type: string\n responses:\n \"200\":\n description: ok\n content:\n application/json:\n schema:\n $ref: \"#/components/schemas/User\"\ncomponents:\n schemas:\n User:\n type: object\n required: [id, name]\n properties:\n id:\n type: string\n name:\n type: string", "sourceFormat": "yaml", "outputFormat": "flat", "namingStyle": "pascal", "declarationStyle": "interface", "namespaceName": "Api", "includeOperationTypes": true, "includeDescriptions": true }

关键信息

分类
Development
输入类型
textarea, select, text, checkbox
输出类型
text
样本覆盖
4
支持 API
Yes

概览

OpenAPI 转 TypeScript 类型生成器是一款高效的开发工具,旨在帮助开发者将 OpenAPI 或 Swagger 规范(JSON/YAML)快速转换为类型安全的 TypeScript 接口、请求参数及响应模型,从而显著提升前后端联调效率并减少手动编写类型定义的工作量。

适用场景

  • 在项目初期根据后端提供的 OpenAPI 文档快速初始化前端 API 类型定义时。
  • 当后端接口规范发生变更,需要同步更新前端 TypeScript 类型声明时。
  • 在需要统一前后端数据契约,确保 API 调用类型安全与代码规范一致时。

工作原理

  • 将 OpenAPI 或 Swagger 的 JSON/YAML 规范内容粘贴至输入框。
  • 根据项目需求选择输出格式(扁平导出或命名空间)、命名风格及声明方式(Interface 或 Type)。
  • 勾选是否包含接口操作类型及注释,点击生成即可获取对应的 TypeScript 代码。

使用场景

快速生成符合项目规范的 API 请求与响应类型定义。
在 TypeScript 项目中实现全链路的类型安全校验。
自动化维护前后端接口契约,减少因文档更新导致的手动修改错误。

用户案例

1. 从 OpenAPI 规范生成扁平 API 类型

前端开发工程师
背景原因
项目后端提供了最新的 OpenAPI 3.0 规范文档,需要快速在前端项目中建立对应的 API 类型定义。
解决问题
手动编写 TypeScript 接口耗时且容易出错,无法保证与后端定义完全同步。
如何使用
将 YAML 格式的规范粘贴到输入框,选择“扁平导出”和“Interface”风格,开启包含描述注释。
示例配置
sourceFormat: yaml, outputFormat: flat, namingStyle: pascal, declarationStyle: interface, includeDescriptions: true
效果
生成了清晰的 User 接口及对应的 GetUserResponse 类型,包含所有字段定义及原始注释。

用 Samples 测试

json, yaml

相关专题

常见问题

该工具支持哪些版本的 OpenAPI 规范?

支持 OpenAPI 3.0 及以上版本,同时也兼容常见的 Swagger 2.0 规范。

生成的类型支持哪些命名风格?

支持 PascalCase、camelCase 以及保留原样三种命名风格,方便适配不同的项目编码规范。

我可以选择生成 interface 还是 type 吗?

可以,工具提供了声明风格选项,支持在 interface 和类型别名(type)之间进行切换。

生成的代码是否包含原始文档中的注释?

是的,只要勾选“包含描述注释”选项,工具会自动将 OpenAPI 中的 description 字段转换为 TypeScript 的 JSDoc 注释。

如果接口定义非常复杂,生成的结果会乱吗?

工具支持“命名空间包裹”模式,可以将生成的类型组织在指定的命名空间内,有效避免全局命名冲突。

API 文档

请求端点

POST /zh/api/tools/openapi-to-typescript-generator

请求参数

参数名 类型 必填 描述
specInput textarea -
sourceFormat select -
outputFormat select -
namingStyle select -
declarationStyle select -
namespaceName text -
includeOperationTypes checkbox -
includeDescriptions checkbox -

响应格式

{
  "result": "Processed text content",
  "error": "Error message (optional)",
  "message": "Notification message (optional)",
  "metadata": {
    "key": "value"
  }
}
文本: 文本

AI MCP 文档

将此工具添加到您的 MCP 服务器配置中:

{
  "mcpServers": {
    "elysiatools-openapi-to-typescript-generator": {
      "name": "openapi-to-typescript-generator",
      "description": "将 OpenAPI 或 Swagger 的 JSON/YAML 规范转换为 TypeScript 接口类型、请求参数类型和响应类型,并支持输出格式与命名风格配置",
      "baseUrl": "https://elysiatools.com/mcp/sse?toolId=openapi-to-typescript-generator",
      "command": "",
      "args": [],
      "env": {},
      "isActive": true,
      "type": "sse"
    }
  }
}

你可以串联多个工具,比如:`https://elysiatools.com/mcp/sse?toolId=png-to-webp,jpg-to-webp,gif-to-webp`,最多20个。

如果遇见问题,请联系我们:[email protected]