YAML-Eingabe

TypeScript-Ausgabe

Was ist YAML zu TypeScript?

TypeScript nutzt Interfaces und Typen für die Struktur. Dieses Tool generiert TypeScript-Interfaces aus Ihrem YAML, damit Sie geparste Konfiguration oder Daten typisieren können. Die YAML-1.2-Spezifikation definiert das Eingabeformat.

Die Konvertierung läuft in Ihrem Browser. Nichts wird an einen Server gesendet. Die generierten Typen funktionieren mit Parsern wie js-yaml oder dem yaml-Paket. Für JSON zu TypeScript nutzen Sie JSON zu TypeScript.

Beispiele: YAML zu TypeScript

TypeScript-Interfaces aus YAML generieren. Telekom-Beispiel:

Beispiel: Teilnehmerdatensatz

YAML-Eingabe

TypeScript-Ausgabe:

TypeScript-Ausgabe

Klicken Sie oben auf die Schaltfläche Beispiel, um weitere Beispiele in den Editor zu laden.

So verwenden Sie dieses Tool

1

YAML einfügen oder hochladen

Kopieren Sie Ihr YAML und fügen Sie es in den linken Editor ein. Sie können auch auf <strong>Hochladen</strong> klicken, um eine <code>.yaml</code>- oder <code>.yml</code>-Datei zu laden. Die Schaltfläche <strong>Beispiel</strong> lädt Beispieldaten. Ungültiges YAML zeigt einen Fehler.

2

TypeScript-Ausgabe prüfen

Das rechte Panel zeigt generierte TypeScript-Interfaces. Nutzen Sie sie mit js-yaml oder dem yaml-Paket zum Parsen und Typisieren Ihrer Konfiguration. Passen Sie optionale Felder mit ? oder Union-Typen an.

3

Kopieren oder Herunterladen

Nutzen Sie <strong>Kopieren</strong> oder <strong>Herunterladen</strong>. Für JSON zu TypeScript nutzen Sie JSON zu TypeScript. Zum Formatieren von YAML den YAML Formatierer.

Wann YAML zu TypeScript hilft

Beim Entwickeln von Node.js- oder Frontend-Apps, die YAML-Konfiguration laden (z.B. <code>config.yml</code>, Kubernetes-Manifeste oder CI-Workflows), benötigen Sie typisierte Strukturen für die geparsten Daten. Ein Beispiel hier einzufügen liefert TypeScript-Interfaces für js-yaml oder das yaml-Paket. Manuelles Schreiben von Typen für komplexes verschachteltes YAML ist mühsam; dieses Tool leitet die Struktur aus Ihrem Beispiel ab.

Konfigurationsdateien wie application.yml oder GitHub-Actions-Workflows haben oft tiefe Verschachtelung. Die generierten Typen helfen bei Tippfehlern und bieten Autovervollständigung in Ihrer IDE. Für gezielte Werte aus großem YAML konvertieren Sie zuerst zu JSON und nutzen jq.

Häufig gestellte Fragen

Wie parse ich YAML in TypeScript?

Nutzen Sie <code>js-yaml</code> oder das <code>yaml</code>-Paket. Parsen Sie den YAML-String und weisen Sie dem generierten Typ zu: <code>const config = yaml.parse(str) as MyConfig</code>. Für Runtime-Validierung erwägen Sie Zod oder io-ts.

js-yaml vs. yaml-Paket?

js-yaml ist weit verbreitet. Das yaml-Paket hat eine andere API und bessere Kommentar-Erhaltung. Beide funktionieren mit den generierten Typen.

Sind meine Daten privat?

Ja. Die Generierung läuft vollständig in Ihrem Browser. Kein YAML oder Code wird an einen Server gesendet.

Optionale vs. erforderliche Felder?

Der Generator leitet aus dem Beispiel ab. Fügen Sie <code>?</code> zu Interface-Properties für optionale Felder hinzu. Für strenge Runtime-Validierung nutzen Sie Zod oder Ähnliches mit den generierten Typen als Referenz.

Kann ich es mit Angular oder React nutzen?

Ja. Die generierten Typen funktionieren in jedem TypeScript-Projekt. Laden Sie YAML zur Build-Zeit oder zur Laufzeit und casten Sie zu dem generierten Interface. Für Umgebungskonfiguration erwägen Sie das Laden von YAML in einem Config-Service.

Verwandte Tools

TypeScript-Dokumentation. YAML-Spezifikation. js-yaml. JSON-Spezifikation. MDN.