Catégories

Generateur OpenAPI vers TypeScript

Convertit des specifications OpenAPI ou Swagger JSON/YAML en types TypeScript, parametres de requete et modeles de reponse avec format et style de nommage configurables

Exemples de résultats

1 Exemples

Generer des types API plats depuis OpenAPI

Convertit un petit document OpenAPI en interfaces TypeScript exportees et contrats de points de terminaison

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

export interface GetUserPath {
  id: string;
}

export type GetUserResponse = { status: "200"; data: User };
Voir paramètres d'entrée
{ "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 }

Points clés

Catégorie
Development
Types d’entrée
textarea, select, text, checkbox
Type de sortie
text
Couverture des échantillons
4
API disponible
Yes

Vue d’ensemble

Le générateur OpenAPI vers TypeScript transforme vos spécifications API au format JSON ou YAML en interfaces TypeScript robustes, types de paramètres et modèles de réponse, garantissant une cohérence parfaite entre votre documentation et votre code source.

Quand l’utiliser

  • Pour synchroniser rapidement vos types TypeScript avec les mises à jour de votre documentation API.
  • Pour éliminer les erreurs de saisie manuelle lors de la définition des modèles de données côté client.
  • Pour standardiser les conventions de nommage et de déclaration dans vos projets front-end ou back-end.

Comment ça marche

  • Copiez et collez votre spécification OpenAPI ou Swagger dans la zone de saisie.
  • Sélectionnez le format de sortie (plat ou espace de noms) et le style de nommage souhaité.
  • Choisissez entre l'utilisation d'interfaces ou d'alias de type pour vos déclarations.
  • Générez le code et intégrez directement les types typés dans votre application.

Cas d’usage

Génération automatique de contrats d'interface pour les applications React ou Vue.
Mise à jour rapide des modèles de données suite à une modification du backend.
Standardisation des types API au sein d'une équipe de développement travaillant sur un projet TypeScript.

Exemples

1. Génération d'interfaces pour une API utilisateur

Contexte
Un développeur front-end doit intégrer une nouvelle API utilisateur documentée via un fichier YAML OpenAPI.
Problème
Créer manuellement les interfaces TypeScript est long et risque d'introduire des erreurs de typage.
Comment l’utiliser
Coller le contenu YAML, sélectionner 'Interface' comme style de déclaration et 'PascalCase' pour le nommage.
Configuration d’exemple
sourceFormat: yaml, outputFormat: flat, namingStyle: pascal, declarationStyle: interface
Résultat
Obtention immédiate d'interfaces TypeScript propres et typées, prêtes à être importées dans le projet.

Tester avec des échantillons

json, yaml

Hubs associés

FAQ

Quels formats d'entrée sont supportés ?

L'outil accepte les spécifications OpenAPI ou Swagger au format JSON ou YAML.

Puis-je personnaliser le style de nommage ?

Oui, vous pouvez choisir entre PascalCase, camelCase ou conserver les noms originaux de la spécification.

Quelle est la différence entre les formats 'plat' et 'espace de noms' ?

Le format plat exporte tous les types à la racine, tandis que l'espace de noms regroupe les types sous un conteneur nommé pour éviter les conflits.

L'outil inclut-il les descriptions de l'API ?

Oui, vous pouvez activer l'option pour inclure les descriptions dans les commentaires JSDoc de vos types générés.

Les types d'opérations sont-ils générés automatiquement ?

Oui, l'outil peut inclure les types d'opérations pour faciliter la gestion des paramètres de requête et des réponses.

Documentation de l'API

Point de terminaison de la requête

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

Paramètres de la requête

Nom du paramètre Type Requis Description
specInput textarea Oui -
sourceFormat select Non -
outputFormat select Non -
namingStyle select Non -
declarationStyle select Non -
namespaceName text Non -
includeOperationTypes checkbox Non -
includeDescriptions checkbox Non -

Format de réponse

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

Documentation de MCP

Ajoutez cet outil à votre configuration de serveur MCP:

{
  "mcpServers": {
    "elysiatools-openapi-to-typescript-generator": {
      "name": "openapi-to-typescript-generator",
      "description": "Convertit des specifications OpenAPI ou Swagger JSON/YAML en types TypeScript, parametres de requete et modeles de reponse avec format et style de nommage configurables",
      "baseUrl": "https://elysiatools.com/mcp/sse?toolId=openapi-to-typescript-generator",
      "command": "",
      "args": [],
      "env": {},
      "isActive": true,
      "type": "sse"
    }
  }
}

Vous pouvez chaîner plusieurs outils, par ex.: `https://elysiatools.com/mcp/sse?toolId=png-to-webp,jpg-to-webp,gif-to-webp`, max 20 outils.

Si vous rencontrez des problèmes, veuillez nous contacter à [email protected]