DocumentosImágenesMediaHerramientas PDF

Convertir TypeScript a JavaScript Online

Transpila TypeScript a JavaScript en tu navegador. Sin instalar Node.js ni tsc. Ideal para aprender TS y compartir código.

function greet(user: User) {
  const greeting = "Hello, " + user.name;
  return greeting;
}

const users: User[] = [
  { name: "John", age: 30, active: true },
];
Procesado en tu navegador

TypeScript a JavaScript: sin instalar nada

Sin Node.js ni npm

Transpila TypeScript directamente en el navegador. Sin instalar tsc, sin tsconfig.json, sin dependencias.

Compilador oficial

Usa el compilador TypeScript de Microsoft compilado a WebAssembly — mismo resultado que tsc en local.

Aprende TypeScript

Entiende exactamente qué genera el compilador a partir de tus tipos, interfaces y genéricos.

Comparte código

Comparte snippets JavaScript con equipos o entornos que no tienen TypeScript configurado.

Tres pasos, sin complicaciones

1

Pega tu código TypeScript

Pega tu código .ts: interfaces, tipos, genéricos, enums, decoradores o cualquier característica de TypeScript que quieras convertir a JavaScript puro.

2

Transpilación instantánea

El compilador oficial de TypeScript (compilado a WebAssembly) elimina las anotaciones de tipo y transpila a JavaScript ES2015+ en milisegundos.

3

Copia el JavaScript resultante

Obtén el JavaScript equivalente listo para ejecutar en el navegador, Node.js, o compartir con equipos que no usan TypeScript.

¿Tienes dudas?

El transpilador elimina todos los elementos que son exclusivos de TypeScript y no tienen representación en JavaScript: anotaciones de tipo (: string, : number, : boolean, : T[], etc.), interfaces (interface User {}), aliases de tipo (type ID = string), genéricos (<T>, <T extends U>), modificadores de acceso (public, private, protected, readonly en clases), enumeraciones (enum Direction {} se convierten a objetos JavaScript), el operador as de type assertion, la palabra clave declare para declaraciones ambientales, y los decoradores experimentales (@Component, @Injectable). Las estructuras de control, funciones, clases (la parte de valor, no de tipo), módulos import/export y toda la lógica de programa se conservan exactamente.

El transpilador online usa el compilador oficial de TypeScript (desarrollado por Microsoft, publicado como open source en octubre de 2012, actualmente en versión 5.x) con la configuración target ES2015 o ES2017. Para producción real, el flujo correcto es: instalar TypeScript con npm install typescript, configurar tsconfig.json con strictness apropiada (strict: true es la práctica recomendada desde TypeScript 2.3), y ejecutar tsc o usar bundlers como Vite, esbuild, SWC o webpack con ts-loader. La ventaja de un transpilador online es la velocidad para exploración, aprendizaje o compartir snippets — no reemplaza el toolchain de producción con verificación de tipos, source maps y optimizaciones de bundle.

TypeScript tiene dos sistemas de decoradores: los decoradores legacy (--experimentalDecorators, disponibles desde TypeScript 1.5 en 2015, usados por Angular, NestJS e inversify) y los decoradores TC39 Stage 3 (implementados en TypeScript 5.0, marzo de 2023, siguiendo la propuesta ECMAScript). El transpilador online soporta ambos mediante la configuración correspondiente. Los decoradores legacy generan código JavaScript con llamadas __decorate() y __metadata(); los decoradores TC39 Stage 3 generan código más limpio siguiendo la propuesta ECMAScript estándar.

TypeScript soporta JSX (JavaScript XML, la sintaxis de templates de React) mediante archivos .tsx. La configuración jsx del compilador controla cómo se transforma el JSX: react (transforma a React.createElement(), comportamiento clásico), react-jsx (transforma usando el nuevo JSX transform de React 17+, importando desde react/jsx-runtime), react-native (deja el JSX sin transformar), y preserve (deja el JSX para que lo procese otro transpilador como Babel). Para proyectos React con TypeScript, el flujo recomendado es usar Vite (que usa esbuild internamente para TSX) o el CRA/Next.js que incluye transpilación TSX por defecto.

Sí. Los import y export de módulos ES6 (import x from 'y', export default, export const) se preservan por defecto cuando el target es ES2015 o superior. TypeScript además elimina los import que son únicamente de tipos (import type { User } from './types'), ya que no tienen representación en tiempo de ejecución. Cuando el target es CommonJS (module: commonjs en tsconfig), los import/export se transforman a require()/module.exports, el sistema de módulos de Node.js. Para uso en el navegador con ES modules nativos, el target ES2015 con module: ESNext es lo más apropiado.

Sí. TypeScript fue diseñado por Anders Hejlsberg (también diseñador de C# y Turbo Pascal) en Microsoft y se publicó como open source en octubre de 2012. La definición oficial es que TypeScript es 'JavaScript tipado con escala para aplicaciones grandes'. Todo JavaScript válido es TypeScript válido — puedes renombrar cualquier archivo .js a .ts sin cambios. TypeScript añade: el sistema de tipos (anotaciones, interfaces, genéricos), enumeraciones, decoradores experimentales, y algunas características de etapas avanzadas de ECMAScript. El compilador tsc fue el primer transpilador moderno de JavaScript de gran adopción, precursores de la ecosistema actual de Babel, esbuild, SWC y Vite.

TypeScript a JavaScript online: transpila TS sin instalar Node.js ni tsc

TypeScript es un lenguaje de programación desarrollado por Microsoft y publicado como open source en octubre de 2012. Fue diseñado por Anders Hejlsberg, también responsable del diseño de C# (2000) y Turbo Pascal (1983), con el objetivo de escalar JavaScript para aplicaciones grandes mediante un sistema de tipos estático opcional. TypeScript es un superconjunto sintáctico de JavaScript (ECMAScript): todo código JavaScript válido es TypeScript válido, y el compilador tsc (TypeScript Compiler) genera JavaScript estándar como salida. Actualmente, TypeScript 5.x (la rama de versiones mayores iniciada con TypeScript 5.0 en marzo de 2023) es uno de los lenguajes más usados según el Stack Overflow Developer Survey 2024, con adopción masiva en ecosistemas como Angular (que requiere TypeScript desde su versión 2 en 2016), NestJS, Next.js, y prácticamente todo proyecto frontend a gran escala. La necesidad de un transpilador online surge en varios escenarios: exploración rápida de cómo TypeScript compila una característica específica sin configurar un proyecto local, aprendizaje interactivo del sistema de tipos, compartir código con desarrolladores o equipos que trabajan con JavaScript puro, y prototipado rápido de snippets.

El proceso de transpilación de TypeScript a JavaScript consiste esencialmente en erasure de tipos (type erasure): el compilador analiza el código TypeScript, verifica la coherencia del sistema de tipos (en modo de verificación de tipos completa, no disponible en transpilación pura), y emite JavaScript eliminando toda información de tipo que no tiene representación en tiempo de ejecución. Los elementos eliminados son: anotaciones de tipo en variables, parámetros y retornos de función; interfaces y aliases de tipo completos (no existen en JavaScript); modificadores de acceso en clases (public/private/protected son solo TypeScript); parámetros de tipo en genéricos; type assertions (as Type, <Type>valor); y declaraciones ambientales (declare). Los elementos que sí se transforman (no solo eliminan) son: las enumeraciones (enum), que se convierten a objetos JavaScript con mapeo bidireccional (valor → nombre y nombre → valor); los decoradores legacy con --experimentalDecorators, que generan código de ayuda __decorate() y __metadata(); y las características de ECMAScript en etapas avanzadas que TypeScript implementa antes de que estén en todos los motores.

El ecosistema de herramientas de transpilación TypeScript ha evolucionado significativamente. El compilador original tsc (escrito en TypeScript, disponible como paquete npm typescript desde 2012) es la referencia de comportamiento y el que ofrece verificación de tipos completa. Para velocidad de build en proyectos grandes, han surgido alternativas que priorizan la velocidad de transpilación sobre la verificación de tipos: esbuild (Evan Wallace, 2020, escrito en Go, 10-100 veces más rápido que tsc), SWC (2019, escrito en Rust, usado por Next.js y Vercel), y el transformador TypeScript de Babel (@babel/plugin-transform-typescript, 2018). Estas herramientas realizan type erasure sin verificar tipos — para verificación de tipos en CI/CD se ejecuta tsc --noEmit en paralelo. Vite (Evan You, 2020) usa esbuild para transpilación TypeScript en desarrollo y Rollup para producción. Convertir.ai usa el compilador oficial TypeScript compilado a WebAssembly para garantizar fidelidad exacta con el comportamiento de tsc, ejecutando todo el proceso en tu navegador sin enviar el código a ningún servidor.