TypeScript Code Formatierer

TypeScript erweitert JavaScript um Typannotationen, Schnittstellen, Generics, Enums und andere Typensystemfunktionen. Ein TypeScript-Formatter muss die gesamte Standard-JavaScript-Formatierung sowie typspezifische Syntax wie Doppelpunkte in Typannotationen (const x: string), spitze Klammern in Generics (Array), Interface- und Typalias-Deklarationen sowie Enum-Formatierung verarbeiten. Standard-JavaScript-Formatter können diese TypeScript-spezifischen Konstrukte brechen oder ignorieren.

Beide Ansätze sind gültig und weit verbreitet. TypeScript (wie JavaScript) verfügt über eine automatische Semikolon-Einfügung (ASI), die Semikolons zur Parse-Zeit hinzufügt, sodass das Weglassen in den meisten Fällen funktioniert. Teams, die Semikolons weglassen, zitieren saubereren Code und weniger Tastenanschläge. Teams, die sie einschließen, zitieren Explizitheit und die Vermeidung seltener ASI-Randfälle. Der Schlüssel ist Konsistenz – wählen Sie einen Stil und erzwingen Sie ihn im gesamten Projekt. Die meisten wichtigen Styleguides (Airbnb, Google) enthalten Semikolons, während StandardJS sie weglässt.

Eine konsistente Importreihenfolge verbessert die Lesbarkeit des Codes und reduziert Merge-Konflikte. Wenn Importe alphabetisch sortiert und logisch gruppiert sind (zuerst Drittanbieterpakete, dann interne Module), können Entwickler bestimmte Importe schnell finden und Duplikate vermeiden. Ungeordnete Importe führen auch zu unnötigen Git-Diffs – zwei Entwickler, die Importe an verschiedenen Positionen hinzufügen, erzeugen einen Merge-Konflikt, obwohl die tatsächliche Codeänderung identisch ist.

Nachgestellte Kommas sind Kommas, die nach dem letzten Element in Arrays, Objekten, Funktionsparametern und Typparametern platziert werden. Die Verwendung von nachgestellten Kommas erzeugt sauberere Git-Diffs, da das Hinzufügen eines neuen Elements nur eine Zeile anstelle von zwei ändert (die neue Zeile plus das Hinzufügen eines Kommas zur vorherigen letzten Zeile). Sie erleichtern auch das Umordnen von Elementen. ES5 erlaubt nachgestellte Kommas in Arrays und Objekten; ES2017 und TypeScript erlauben sie auch in Funktionsparametern.

Die gängigsten Optionen sind 80, 100 und 120 Zeichen. 80 Zeichen sind der traditionelle Standard, der aus den Beschränkungen der Terminalbreite stammt und in Prettier weiterhin Standard ist. 100 Zeichen sind ein beliebter moderner Kompromiss, der die wortreichen Typannotationen von TypeScript ohne übermäßige Umbrüche ermöglicht. 120 Zeichen funktionieren gut auf breiten Monitoren, können aber die Lesbarkeit auf kleineren Bildschirmen oder in Side-by-Side-Diff-Ansichten beeinträchtigen. Wählen Sie basierend auf dem typischen Bildschirm-Setup und dem Code-Review-Workflow Ihres Teams.