TypeScript ist eine Obermenge von JavaScript, die zum Erstellen sichererer, umfangreicher Anwendungen entwickelt wurde. Es fügt der Sprache eine optionale statische Typisierung hinzu, wodurch es einfacher wird, Fehler vor der Kompilierung zu erkennen.
Die Sprache führt auch einige Funktionen ein, die in JavaScript nicht vorhanden sind. Dazu gehören Generics, Klassen, Interfaces, Enums und Decorators.
Erfahren Sie, wie Sie Ihr erstes TypeScript-Projekt in nur wenigen Schritten von Grund auf neu einrichten.
Schritt 1: TypeScript installieren
Vor Gebrauch Typoskript Auf Ihrem System müssen Sie den TypeScript-Compiler global installieren.
Führen Sie den folgenden Befehl aus, um TypeScript global zu installieren:
npm Installieren -g Typoskript
Schritt 2: Einrichten Ihres Projekts
Um Ihr TypeScript-Projekt einzurichten, erstellen Sie zunächst ein leeres Projektverzeichnis in jede IDE Ihrer Wahl.
Erstellen Sie dann Ihre Dateien mit der .ts Dateierweiterung. TypeScript kann in keiner Umgebung ausgeführt werden. Daher muss es in JavaScript kompiliert werden, bevor es ausgeführt werden kann.
Um Ihre TypeScript-Dateien in JavaScript zu kompilieren, navigieren Sie auf Ihrem Terminal zu Ihrem Projektverzeichnis. Dann renne tsc gefolgt vom Namen Ihrer TypeScript-Datei.
Zum Beispiel:
tscIndex.ts
Dieser Befehl erstellt eine index.js Datei im selben Verzeichnis Ihre index.ts Datei liegt.
Dieses Verhalten kann unerwünscht sein, da es die Verwaltung Ihres Projekts mit mehreren erschweren würde .js und .ts Dateien im selben Verzeichnis.
Sie ändern dieses Standardverhalten und modifizieren das Verhalten Ihres TypeScript-Compilers mithilfe von tsconfig.json Datei.
Führen Sie den folgenden Befehl in Ihrem Terminal aus, um eine zu erstellen tsconfig.json Datei in Ihrem Projekt:
tsc --drin
Dadurch wird eine Datei generiert, die alle Konfigurationseinstellungen für Ihren TypeScript-Compiler enthält.
Sie behandeln hier nur die Grundlagen, die zum Starten Ihres Projekts erforderlich sind, aber Sie können hier mehr darüber erfahren die TypeScript tsconfig-Dokumentation.
Schritt 3: Einrichten des TypeScript-Compilers für einen besseren Workflow
Das tsconfig.json Datei enthält Konfigurationsoptionen für den TypeScript-Compiler, der in sieben Abschnitte unterteilt ist:
- Projekte
- Sprache und Umwelt
- Module
- JavaScript-Unterstützung
- Emittieren
- Interop-Einschränkungen
- Typprüfung
- Vollständigkeit
Die meisten Eigenschaften sind standardmäßig deaktiviert (sie sind auskommentiert). Sie können sie aktivieren und ändern, indem Sie sie auskommentieren.
Hier sind die Schritte, die Sie befolgen müssen, um den Speicherort Ihrer generierten JavaScript-Dateien zu ändern:
- Offen tsconfig.json und lokalisiere die emittieren Sektion.
- In dem emittieren Abschnitt, kommentieren Sie die outDir -Eigenschaft und geben Sie das Verzeichnis an, in dem Sie die kompilierte Datei speichern möchten .ts Dateien. Jetzt, wann immer Sie laufen tsc, dein .js Die Dateien befinden sich im angegebenen Ordner.
Betrieb tsc gefolgt vom Namen der Datei, die Sie kompilieren möchten, ist für Ihren Arbeitsablauf nicht optimal, insbesondere wenn Sie mehrere Dateien kompilieren müssen.
Um dieses Problem zu lösen, stellt der TypeScript-Compiler eine Eigenschaft bereit, die es ihm ermöglicht, alle Dateien in einem Verzeichnis in einem Befehl zu kompilieren.
Befolgen Sie diese Schritte, um dies einzurichten:
- Offen tsconfig.json und lokalisiere die Module Sektion.
- In dem Module Abschnitt, kommentieren Sie die rootDir Eigentum bzw rootDirs (Wenn Sie möchten, dass der Compiler mehrere kompiliert .ts Verzeichnisse hinein .js) und geben Sie das/die Dateiverzeichnis(se) an.
Diese Einstellungen werden Ihren Arbeitsablauf verbessern und Ihre Dateien leichter zu pflegen sein.
Die Vorteile von TypeScript
Der große Vorteil von TypeScript gegenüber JavaScript ist seine Typsicherheit. TypeScript ermöglicht es, schwer zu findende Fehler schnell zu erkennen. Diese Funktion macht es ideal für den Aufbau sicherer und umfangreicher Anwendungen.
