Générez des interfaces ou des types TypeScript à partir d'un exemple JSON
Fonctionne dans votre navigateur. Rien de ce que vous saisissez n'est envoyé nulle part.Écrire une interface à la main à partir d'une réponse JSON est fastidieux et source d'erreurs. Collez 1 exemple et récupérez des interfaces ou des types TypeScript, objets imbriqués et tableaux compris. L'exemple reste dans votre navigateur : une réponse pleine de vraies données ne va nulle part.
Cette page a été traduite automatiquement à partir de l'original anglais. Aucune personne n’a encore relu la traduction : c’est la version anglaise qui fait foi. Lire l'original en anglais
Collez un exemple de réponse JSON dans le panneau JSON, ou cliquez sur Essayer un exemple.
Définissez le Nom racine et choisissez Interface ou Type.
Choisissez comment typer les valeurs null, « | null » ou Facultatif, et activez ou désactivez Export ou Readonly.
Cliquez sur Copier, ou sur l'icône de téléchargement pour enregistrer un fichier .ts nommé d'après le type racine.
Ce convertisseur JSON vers TypeScript lit un échantillon de vos données et écrit les interfaces ou alias de type correspondants. Chaque objet imbriqué reçoit sa propre déclaration nommée, les tableaux reçoivent un type d'élément, et le résultat se met à jour pendant la saisie : vous collez une réponse et copiez des types fonctionnels une seconde plus tard.
Les développeurs s'en servent pour brancher une nouvelle API : ils collent une réponse depuis l'onglet réseau et obtiennent les types pour l'appel fetch. Il aide aussi quand un fichier de configuration ou la charge d'un webhook est devenu trop gros pour être typé à la main, ou quand on hérite de fixtures JSON non typées et qu'on veut que le compilateur commence à repérer les erreurs.
Le générateur examine chaque élément d'un tableau, pas seulement le premier. Les objets d'un tableau sont fusionnés en une seule interface, et une clé absente de certains d'entre eux devient facultative. Un champ qui contient différents genres de valeurs devient une union, comme string | number. Les valeurs null ajoutent | null ou rendent la propriété facultative ; à vous de choisir. Les formes identiques partagent une déclaration, et les clés comme pin-code sont mises entre guillemets.
Tout s'exécute dans votre navigateur et rien de ce que vous collez n'est envoyé. Les types ne décrivent que l'échantillon fourni : incluez un exemple de chaque variante attendue. Ctrl+Entrée copie le résultat. Outils liés : JSON Formatter, YAML to JSON, CSV to JSON.
Collez le JSON dans le panneau de gauche. Les interfaces apparaissent à droite pendant la saisie. Définissez le nom racine, choisissez interface ou type, puis appuyez sur Copier ou Ctrl+Entrée et collez le résultat dans un fichier .ts.
Tout ici est gratuit, sans inscription ni plafond de conversions. La conversion s'exécute entièrement dans votre navigateur : le JSON collé ne quitte jamais votre appareil et aucune copie n'atteint un serveur. Vous pouvez coller sans risque des réponses d'API contenant des jetons d'accès, des adresses e-mail ou des détails de commande.
Quand un tableau contient plusieurs objets, ils sont fusionnés en une seule interface. Une clé présente dans certains seulement est marquée facultative avec un point d'interrogation. Avec l'option null réglée sur Facultatif, une clé dont la valeur est null est aussi marquée facultative.
Les deux décrivent la même forme. Les interfaces peuvent être étendues et fusionnées, et beaucoup d'équipes les préfèrent pour les objets. Les alias de type peuvent aussi exprimer des unions et des types mappés. Prenez celui qu'utilise déjà votre code ; l'outil écrit l'un ou l'autre.
Le type d'élément devient une union, par exemple (string | number)[]. Un tableau vide devient unknown[] car il n'y a rien à déduire ; ajoutez un élément d'exemple pour obtenir un type précis.
Oui. Des fichiers de quelques mégaoctets se convertissent en bien moins d'une seconde. L'imbrication profonde ne pose pas de problème ; chaque niveau reçoit sa propre déclaration nommée, et les formes identiques sont réutilisées au lieu d'être répétées.
Toujours bloqué ? Poser une question sur JSON vers TypeScript et toute personne qui connaît la réponse peut répondre. Aucun compte nécessaire.