Naar de inhoud

TypeScript naar JavaScript-converter online - TS/TSX naar JS/JSX — Numio

Verwijder TypeScript-typen — annotaties, interfaces, type-aliassen en generieke typen — om gewone JavaScript te krijgen. Dit werkt voor .ts en .tsx: JSX blijft ongewijzigd, zodat een TSX-component JSX wordt. De code wordt lokaal in je browser omgezet; er vindt geen typecontrole, bundeling of uitvoering plaats.

Bekijk hoe een TypeScript-fragment er als gewone JavaScript uitziet voordat je het in een JS-project gebruikt.

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

Laad een voorbeeld (vervangt je invoer)

TypeScript

JavaScript

Wanneer gebruik je dit?

  • Bekijk hoe een TypeScript-fragment er als gewone JavaScript uitziet voordat je het in een JS-project gebruikt.
  • Zet een React-component van .tsx om naar .jsx door de prop-typen te verwijderen en de JSX te behouden.

Hoe werkt het

  1. Plak TypeScript of TSX, of laad een voorbeeld (interface en functie, generieke typen of JSX). Een voorbeeld vervangt je huidige invoer.
  2. Bekijk rechts de JavaScript. Typeannotaties en interfaces verdwijnen; onderdelen met een waarde tijdens uitvoering, zoals een enum, worden omgezet naar JavaScript-code.
  3. Kopieer het resultaat. Als je typeveiligheid nodig hebt, controleer de oorspronkelijke TypeScript afzonderlijk met tsc --noEmit.

TypeScript-invoer

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

JavaScript-uitvoer

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

Details en beperkingen

Je code wordt lokaal in je browser omgezet en niet geüpload. Wis de invoer na gebruik op een gedeeld apparaat.

Typen verwijderen is geen typecontrole: const count: number = "text" wordt zonder foutmelding geconverteerd. Controleer typen met de TypeScript-compiler.

JSX blijft JSX. Om React-componenten in een browser uit te voeren, heb je nog steeds de JSX-buildstap van je project nodig.

Constructies met waarden tijdens uitvoering, zoals enum, leveren JavaScript-code op in plaats van te verdwijnen.

Alleen de geplakte code wordt omgezet. Imports worden niet opgezocht, bestanden niet gebundeld en moderne syntaxis niet aangepast voor oudere browsers.

FAQ

Kan ik TSX naar JSX omzetten?

Ja. Plak de .tsx-component: prop-typen en interfaces worden verwijderd en de JSX blijft ongewijzigd, zodat je het resultaat als .jsx kunt opslaan. JSX compileren naar React.createElement-aanroepen valt buiten deze tool.

Wat is het verschil met tsc uitvoeren?

tsc controleert de typen in een heel project en kan JavaScript genereren voor een gekozen doelomgeving. Deze pagina verwijdert alleen typen uit de geplakte code met de TypeScript-transformatie van Babel, behoudt moderne syntaxis en meldt geen typefouten. Gebruik voor volledige projecten lokaal tsc of een bundler zoals esbuild.

Waarom werd code met typefouten toch geconverteerd?

De conversie werkt op syntaxisniveau. Toewijzingen en functieaanroepen worden niet aan hun typen getoetst. Voer de TypeScript-compiler in je project uit om typefouten te vinden.

Wat moet ik controleren bij een syntaxisfout?

Bekijk de vermelde regel en kolom, de omliggende haakjes en eventuele typeannotaties. Een kleiner codefragment helpt het probleem te vinden. Gebruik Opnieuw proberen bij een verbindingsfout.

Specificaties en referenties