Xerobit

TypeScript to JavaScript Converter

Paste TypeScript and get plain JavaScript back. Types, interfaces, generics, casts and access modifiers are removed, and enums and parameter properties are expanded the way tsc writes them. Unsupported syntax is listed, and it runs in your browser.

Result

var Role;
(function (Role) {
    Role[Role["Admin"] = 0] = "Admin";
    Role[Role["Editor"] = 5] = "Editor";
    Role[Role["Viewer"] = 6] = "Viewer";
})(Role || (Role = {}));

export class Account {
  id;
  owner;
  balance = 0;
  constructor(id, owner) {
    this.id = id;
    this.owner = owner;
  }

  deposit(amount) {
    this.balance += amount;
    return this;
  }
}

export function find(items, id) {
  return items.find((u) => u.id === id);
}
  • Type constructs removed
    16

How to use the typescript to javascript converter

  1. Paste your TypeScript into the box. The sample already contains an interface, an enum, a generic class and a cast.
  2. The JavaScript appears below straight away. Comments, blank lines and your formatting are kept, only the type syntax is removed.
  3. Check the Not converted row. It lists any syntax that needs a real compiler, such as decorators or namespaces.
  4. Copy the result into a .js or .mjs file. Run the JavaScript beautifier afterwards if you want it re-indented.

How TypeScript to JavaScript conversion works

TypeScript is JavaScript plus type syntax, so for most code, turning typescript to javascript means deleting the types and nothing else. This converter reads the source as tokens, finds every place where a type can appear, and removes exactly that text. Your formatting, comments and line breaks stay as they were, which keeps the result easy to diff against the original.

It does not check types, rename anything or rewrite modern syntax. Optional chaining, classes, async functions and other current JavaScript pass through untouched.

What gets removed

TypeScriptResult
let n: number = 1let n = 1
function f(a?: string): voidfunction f(a)
interface, type, declareWhole statement removed
x as T, x satisfies T, <T>xx
value!value
new Map<K, V>()new Map()
class A<T> implements Iclass A
private, public, readonly, override, abstractKeyword removed; abstract members removed
Overload signaturesRemoved, implementation kept
import type, export type, { type A }Removed

Enums and parameter properties

Two features produce code instead of just deleting it. An enum becomes an object built by a small function, with a reverse mapping for numeric members, exactly as tsc emits it. Constant initializers such as 1 << 2 or A | B are folded to numbers, and string members get no reverse entry.

A constructor parameter written as constructor(private x: number) declares and assigns a field. The converter adds a class field x; and a this.x = x; line, placed after super(...) in derived classes. This matches the output of tsc for modern targets.

Imports that disappear

Like tsc, the converter drops imports that are no longer used once the types are gone. import { User } from "./types" vanishes when User was only ever an annotation, and import type lines and type specifiers are removed outright. A bare import "./side-effect" is always kept.

If everything module-related is removed from a file, an export {}; line is added so the file stays an ES module, again the same as tsc.

Unsupported constructs

Some TypeScript features need a full compiler. They are left in place and listed in the Not converted row so you know where to look.

  • Decorators (@Component), which depend on compiler settings.
  • namespace and module blocks.
  • import x = require() and export =.
  • JSX and TSX markup.

One layout is also not recognised: an arrow function with a return type used as the middle branch of a conditional, as in a ? (b): T => c : d. Write that one with parentheses around the arrow.

Converter, tsc or Node type stripping?

A ts to js converter like this is quick for snippets, code review and moving a file to a JavaScript project. For a whole project, use tsc or a bundler, which also check types and can target older browsers.

Recent Node.js versions can run .ts files by stripping types, but only types: enums, namespaces and parameter properties are rejected unless a transform mode is switched on. Running such code through this converter first is an easy workaround. For code in the opposite direction, JSON to types, see JSON to TypeScript.

Worked examples

ExampleInputResult
Types and genericsTypeScript: function add(a: number, b?: number): number { / return a + (b ?? 0); / } / const box = <T,>(v: T): { value: T } => ({ value: v }); / let ids: Array<string> = []; / Type constructs removed: 8
EnumTypeScript: export enum Level { Low = "low", High = "high" } / enum Flags { None = 0, A = 1 << 0, B = 1 << 1, AB = A | B } / Type constructs removed: 2
Class with parameter propertiesTypeScript: class Point { / constructor(private readonly x: number, public y: number = 0) {} / len(): number { return Math.hypot(this.x, this.y); } / } / Type constructs removed: 3
Imports, casts and overloadsTypeScript: import type { Config } from "./config"; / import { load, type Options } from "./load"; / function parse(s: string): number; / function parse(s: number): number; / function parse(s: any): number { return Number(s); } / const el = document.getElementById("a") as HTMLInputElement; / console.log(load(el.value!)); / Type constructs removed: 12

FAQ

How do I convert TypeScript to JavaScript?

Paste the TypeScript into the box. Types, interfaces, generics and casts are removed and enums are expanded, giving JavaScript you can copy straight away. Nothing is uploaded.

Does it check my types?

No. It only removes type syntax, so code with type errors converts just the same. Use tsc or your editor for type checking.

How are enums converted?

To a var and an immediately invoked function that fills an object, the same shape tsc produces. Numeric members get a reverse mapping, and string members do not.

Why was an import removed?

It was only used for types. tsc removes such imports too, because they do nothing at run time. Side-effect imports without names are always kept.

Can I convert TSX or code with decorators?

Not yet. JSX markup, decorators, namespaces and import equals syntax are left unchanged and listed under Not converted, so you can handle them with a compiler.

Is my code sent anywhere?

No. The conversion runs in your browser and the code never leaves your device.

Sources and references