Convertir TypeScript en JavaScript en Ligne
Transpile du TypeScript en JavaScript dans ton navigateur. Aucune installation de Node.js ou de tsc necessaire. Parfait pour apprendre TS et partager du code.
function greet(user: User) {
const greeting = "Hello, " + user.name;
return greeting;
}
const users: User[] = [
{ name: "John", age: 30, active: true },
];Pourquoi utiliser ce transpilateur
TypeScript en JavaScript : aucune installation necessaire
Aucun Node.js ni npm
Transpile du TypeScript directement dans le navigateur. Aucune installation de tsc, de tsconfig.json ni de dependances.
Compilateur officiel
Utilise le compilateur TypeScript de Microsoft compile en WebAssembly -- meme sortie que tsc en local.
Apprendre TypeScript
Comprends exactement ce que le compilateur genere depuis tes types, interfaces et generiques.
Partager du code
Partage des snippets JavaScript avec des equipes ou des environnements qui n'ont pas TypeScript configure.
Comment ça marche
Trois étapes, sans complications
Colle ton code TypeScript
Colle ton code .ts : interfaces, types, generiques, enums, decorateurs ou n'importe quelle fonctionnalite TypeScript a convertir en JavaScript simple.
Transpilation instantanee
Le compilateur TypeScript officiel (compile en WebAssembly) supprime les annotations de type et transpile en JavaScript ES2015+ en quelques millisecondes.
Copie le JavaScript resultant
Obtiens le JavaScript equivalent pret a executer dans un navigateur, Node.js, ou a partager avec des equipes qui n'utilisent pas TypeScript.
FAQ
Des questions ?
Le transpilateur supprime tous les elements exclusifs a TypeScript sans representation en JavaScript : les annotations de type (: string, : number, : boolean, : T[], etc.), les interfaces (interface User {}), les alias de type (type ID = string), les generiques (<T>, <T extends U>), les modificateurs d'acces (public, private, protected, readonly sur les classes), les enumerations (enum Direction {} est converti en objet JavaScript), l'operateur d'assertion de type as, le mot-cle declare pour les declarations ambiantes, et les decorateurs experimentaux (@Component, @Injectable). Les structures de controle, fonctions, classes (la partie valeur, pas la partie type), les modules import/export et toute la logique du programme sont preserves exactement.
Le transpilateur en ligne utilise le compilateur TypeScript officiel (developpe par Microsoft, publie en open source en octobre 2012, actuellement a la version 5.x) avec la configuration cible ES2015 ou ES2017. Pour une vraie production, le workflow correct est : installer TypeScript avec npm install typescript, configurer tsconfig.json avec la rigueur appropriee (strict: true est la pratique recommandee depuis TypeScript 2.3), et executer tsc ou utiliser des bundlers comme Vite, esbuild, SWC ou webpack avec ts-loader. L'avantage d'un transpilateur en ligne est la rapidite pour l'exploration, l'apprentissage ou le partage de snippets -- il ne remplace pas la chaine de production avec la verification des types, les source maps et les optimisations de bundle.
TypeScript a deux systemes de decorateurs : les decorateurs legacy (--experimentalDecorators, disponibles depuis TypeScript 1.5 en 2015, utilises par Angular, NestJS et inversify) et les decorateurs TC39 Stage 3 (implementes dans TypeScript 5.0, mars 2023, suivant la proposition ECMAScript). Le transpilateur en ligne supporte les deux via la configuration correspondante. Les decorateurs legacy generent du code JavaScript avec des appels a __decorate() et __metadata() ; les decorateurs TC39 Stage 3 generent du code plus propre suivant la proposition ECMAScript standard.
TypeScript supporte JSX (JavaScript XML, la syntaxe de template de React) via les fichiers .tsx. La configuration jsx du compilateur controle comment le JSX est transforme : react (transforme en React.createElement(), comportement classique), react-jsx (transforme en utilisant le nouveau JSX transform de React 17+, en important depuis react/jsx-runtime), react-native (laisse le JSX non transforme), et preserve (laisse le JSX pour un autre transpilateur comme Babel). Pour les projets React avec TypeScript, le workflow recommande est d'utiliser Vite (qui utilise esbuild en interne pour le TSX) ou CRA/Next.js qui inclut la transpilation TSX par defaut.
Oui. Les imports et exports de modules ES6 (import x from y, export default, export const) sont preserves par defaut quand la cible est ES2015 ou superieure. TypeScript supprime aussi les imports uniquement de types (import type { User } from './types'), car ils n'ont pas de representation a l'execution. Quand la cible est CommonJS (module: commonjs dans tsconfig), les imports/exports sont transformes en require()/module.exports, le systeme de modules de Node.js. Pour une utilisation dans le navigateur avec les modules ES natifs, la cible ES2015 avec module: ESNext est la plus appropriee.
Oui. TypeScript a ete concu par Anders Hejlsberg (aussi concepteur de C# et de Turbo Pascal) chez Microsoft et publie en open source en octobre 2012. La definition officielle est que TypeScript est du JavaScript type pour les grandes applications. Tout JavaScript valide est du TypeScript valide -- tu peux renommer n'importe quel fichier .js en .ts sans changements. TypeScript ajoute : le systeme de types (annotations, interfaces, generiques), les enumerations, les decorateurs experimentaux et certaines fonctionnalites ECMAScript en phase avancee. Le compilateur tsc a ete le premier transpilateur JavaScript moderne largement adopte, predecesseur de l'ecosysteme actuel de Babel, esbuild, SWC et Vite.
TypeScript en JavaScript en ligne : transpilez du TS sans installer Node.js ni tsc
TypeScript est un langage de programmation developpe par Microsoft et publie en open source en octobre 2012. Il a ete concu par Anders Hejlsberg -- aussi responsable du design de C# (2000) et de Turbo Pascal (1983) -- dans le but de faire passer a l'echelle le JavaScript pour les grandes applications via un systeme de types statiques optionnel. TypeScript est un sur-ensemble syntaxique de JavaScript (ECMAScript) : tout JavaScript valide est du TypeScript valide, et le compilateur tsc (TypeScript Compiler) produit du JavaScript standard. TypeScript 5.x (la branche de version majeure initiee avec TypeScript 5.0 en mars 2023) est l'un des langages les plus utilises selon le Stack Overflow Developer Survey 2024, avec une adoption massive dans des ecosystemes comme Angular (qui exige TypeScript depuis la version 2 en 2016), NestJS, Next.js et pratiquement tous les projets frontend de grande echelle. Le besoin d'un transpilateur en ligne se manifeste dans plusieurs scenarios : explorer rapidement comment TypeScript compile une fonctionnalite specifique sans configurer un projet local, l'apprentissage interactif du systeme de types, le partage de code avec des developpeurs ou des equipes travaillant en JavaScript simple, et le prototypage rapide de snippets.
Le processus de transpilation TypeScript vers JavaScript consiste essentiellement en l'effacement des types : le compilateur analyse le code TypeScript, verifie la coherence du systeme de types (en mode de verification complete des types, non disponible en transpilation pure), et emet du JavaScript en supprimant toutes les informations de type n'ayant pas de representation a l'execution. Les elements supprimes sont : les annotations de type sur les variables, les parametres de fonction et les types de retour ; les interfaces et alias de type complets (qui n'existent pas en JavaScript) ; les modificateurs d'acces sur les classes (public/private/protected sont specifiques a TypeScript) ; les parametres de type dans les generiques ; les assertions de type ; et les declarations ambiantes (declare). Les elements transformes (et pas seulement supprimes) sont : les enumerations (enum), convertis en objets JavaScript avec mappage bidirectionnel ; les decorateurs legacy avec --experimentalDecorators, qui generent du code auxiliaire __decorate() et __metadata() ; et certaines fonctionnalites ECMAScript en phase avancee que TypeScript implemente avant qu'elles soient disponibles dans tous les moteurs.
L'ecosysteme d'outils de transpilation TypeScript a considerablement evolue. Le compilateur tsc original (ecrit en TypeScript, disponible comme package npm typescript depuis 2012) est la reference comportementale et celui qui fournit la verification complete des types. Pour la vitesse de build sur de grands projets, des alternatives ont emerge qui privilegient la vitesse de transpilation sur la verification des types : esbuild (Evan Wallace, 2020, ecrit en Go, 10 a 100 fois plus rapide que tsc), SWC (2019, ecrit en Rust, utilise par Next.js et Vercel), et le transformateur TypeScript de Babel (@babel/plugin-transform-typescript, 2018). Ces outils effectuent l'effacement des types sans verifier les types -- pour la verification des types en CI/CD, tsc --noEmit est execute en parallele. Vite (Evan You, 2020) utilise esbuild pour la transpilation TypeScript en developpement et Rollup pour la production. Convertir.ai utilise le compilateur TypeScript officiel compile en WebAssembly pour garantir une fidelite exacte avec le comportement de tsc, en executant l'ensemble du processus dans ton navigateur sans envoyer de code a aucun serveur.