Seite 13 - TypeScript

Deno führt .ts-Dateien direkt aus, ohne tsc, ohne ts-node und ohne node_modules. Wer aus dem Node.js-Ökosystem kommt, muss dafür ein paar Annahmen über Type-Checking, Module und Sicherheit neu justieren.

Wer TypeScript-Projekte wachsen lässt, ohne die Compiler-Performance im Blick zu behalten, erlebt irgendwann minutenlange Build-Zeiten und einen tsserver, der im Editor spürbar hängt. Kombinatorische Typinstanziierung, riesige Union-Typen und fehlende Project References sind die häufigsten Ursachen. Dieser Artikel zeigt praxisnah, wie man langsame Builds mit generateTrace diagnostiziert, typische Fallen erkennt und mit Project References sowie inkrementellen Builds gezielt beschleunigt.

Die rohe TypeScript Compiler API ist mächtig, aber für alltägliche Codegenerierung unnötig umständlich. ts-morph legt eine objektorientierte, lesbare Schicht darüber und macht aus zehn Zeilen AST-Traversierung einen einzigen verständlichen Methodenaufruf, ohne dabei Typinformationen oder Präzision zu verlieren.

Statisch getippte Frontends verlassen sich oft blind auf handgeschriebene Interfaces, während sich die API im Hintergrund längst weiterentwickelt hat. Aus einer einzigen OpenAPI-Spezifikation generierte TypeScript-Typen, kombiniert mit Laufzeitvalidierung durch zod, schließen genau diese Lücke und halten Backend und Headless-Frontend in Magento- und PWA-Projekten dauerhaft synchron.

tsconfig.json ist die zentrale Steuerzentrale jedes Projekts mit TypeScript und entscheidet über Kompatibilität, Fehlerstrenge und Buildgeschwindigkeit. Dieser Artikel erklärt die wichtigsten Optionen wie target, module, strict, esModuleInterop und skipLibCheck im Detail, liefert eine sinnvolle Basiskonfiguration für neue Projekte und zeigt, wie sich Konfiguration mit extends sauber über ein Monorepo teilen lässt.

Minifiziertes JavaScript ohne Source Maps macht jeden Produktionsfehler zu einer Rätselraterei aus kryptischen Zeilennummern. Wer Source Maps aber einfach öffentlich neben dem Bundle ausliefert, legt seinen kommentierten TypeScript-Quellcode für jeden Besucher offen. Hidden Source Maps und ein kontrollierter Upload an Error-Tracking-Dienste lösen dieses Dilemma sauber.

TypeScript leitet die meisten Typen automatisch aus Literalen, Rückgabewerten und dem umgebenden Kontext ab, ohne dass Entwickler jede Variable manuell annotieren müssen. Dieser Artikel zeigt, wie die Inferenz-Engine des Compilers tatsächlich arbeitet, wann automatisch abgeleitete Typen ausreichen und wann explizite Annotationen die Codequalität und Wartbarkeit spürbar verbessern.

Wer document.querySelector Ergebnisse pauschal mit as any oder as HTMLInputElement erzwingt, verliert genau die Typsicherheit, die TypeScript eigentlich verspricht. Dieser Artikel zeigt, wie DOM-Elemente, Events, Formulare und Custom-Data-Attribute mit den eingebauten lib.dom.d.ts Typen, echten Null-Prüfungen, sauberen Type Guards und typisierten Event-Listenern korrekt abgesichert werden, damit der Compiler echte Fehler findet statt sie mit any zu verstecken.

Wer aus der Magento- oder Symfony-Welt kommt, kennt Dependency Injection bereits aus di.xml und dem Service Container. Dieser Artikel zeigt, wie sich dasselbe Prinzip in TypeScript-Projekten umsetzen lässt, mit Constructor Injection als Standardpattern, Interfaces als Verträgen für testbaren Code und der Entscheidung, wann ein DI-Container wie InversifyJS wirklich nötig ist.

Ein uneingeschränkter Generic-Typparameter erlaubt fast alles und verhindert dadurch jeden sinnvollen Zugriff auf Eigenschaften oder Methoden. Mit dem extends Schlüsselwort, keyof und durchdachten Default-Werten lassen sich Typparameter gezielt eingrenzen, sodass der Compiler echte Fehler findet und Entwickler beim Schreiben von Code verlässliche Autovervollständigung erhalten. Der Artikel zeigt anhand einer typsicheren pick-fields Funktion, wie diese Konzepte zusammenspielen.