Aller au contenu

Convertir TypeScript en JavaScript — Numio

Supprimez les types TypeScript (annotations, interfaces, alias de type et génériques) pour obtenir du JavaScript pur. Fonctionne pour .ts et .tsx : le JSX est conservé tel quel, donc un composant TSX devient du JSX. Le code est converti sur le serveur ; rien n’est vérifié au niveau des types, bundlé ni exécuté.

Voir à quoi ressemble un extrait TypeScript en JavaScript pur avant de l’utiliser dans un projet JS.

Code is converted on the server. No type-checking, execution or dependency bundling is performed. JSX is preserved.

Load an example (replaces your input)

TypeScript

JavaScript

Quand l’utiliser

  • Voir à quoi ressemble un extrait TypeScript en JavaScript pur avant de l’utiliser dans un projet JS.
  • Transformer un composant React .tsx en .jsx en supprimant les types des props tout en conservant le JSX.

Mode d’emploi

  1. Collez du TypeScript ou du TSX, ou chargez un exemple (interface et fonction, génériques, JSX). Charger un exemple remplace votre saisie.
  2. Lisez le JavaScript à droite. Les annotations de type et les interfaces disparaissent ; le code qui existe à l’exécution, comme un enum, est émis en JavaScript.
  3. Copiez le résultat. Si vous avez besoin de sûreté de typage, vérifiez séparément les types du TypeScript d’origine avec tsc --noEmit.

Entrée TypeScript

interface User { name: string }
const greet = (user: User): string => "Hello, " + user.name;

Sortie JavaScript

const greet = (user) => "Hello, " + user.name

Détails et limites

Votre code est envoyé au serveur douni.one pour être converti. Ne collez pas de secrets, de clés d’API ni de code source que vous ne pouvez pas partager.

Supprimer les types n’est pas vérifier les types : const count: number = "text" est converti sans erreur. Vérifiez les types avec le compilateur TypeScript.

Le JSX reste du JSX. Pour exécuter des composants React dans un navigateur, vous avez toujours besoin de l’étape de build JSX de votre projet.

Les constructions qui ont des valeurs à l’exécution, comme enum, produisent du code JavaScript au lieu de disparaître.

Seul le code collé est converti : les imports ne sont pas résolus, les fichiers ne sont pas bundlés et la syntaxe moderne n’est pas transpilée pour les anciens navigateurs.

FAQ

Puis-je convertir du TSX en JSX ?

Oui. Collez le composant .tsx : les types des props et les interfaces sont supprimés et le JSX reste inchangé, donc le résultat peut être enregistré en .jsx. Compiler le JSX en appels React.createElement ne fait pas partie de cet outil.

Quelle différence avec l’exécution de tsc ?

tsc vérifie les types d’un projet entier et peut émettre du JavaScript pour une cible choisie. Cette page se contente de supprimer les types du code collé avec la transformation TypeScript de Babel, conserve la syntaxe moderne et ne signale jamais d’erreurs de type. Pour des projets entiers, lancez tsc ou un bundler comme esbuild en local.

Pourquoi a-t-il converti du code qui contient des erreurs de type ?

La conversion est syntaxique. Elle ne vérifie pas les affectations ni les appels de fonction par rapport à leurs types ; lancez donc le compilateur TypeScript dans votre projet pour trouver les erreurs de type.

Que vérifier en cas d’erreur de syntaxe ?

Regardez la ligne et la colonne indiquées, les crochets et parenthèses alentour et toute annotation de type à cet endroit. Réduire le code à un petit extrait aide à isoler le problème ; en cas d’erreur de connexion, utilisez Retry.

Spécifications et références