TypeScript tsconfig.json-Konfiguration

tsconfig.json ist die Konfigurationsdatei für TypeScript-Projekte und dient zum Festlegen von Compiler-Optionen und Projekteinstellungen.

Basiskonfiguration

Die grundlegendste tsconfig.json-Datei.

Beispiel

{
    "compilerOptions": {
        "target": "ES2020",
        "module": "commonjs",
        "strict": true,
        "outDir": "./dist"
    },
    "include": ["src/**/*"],
    "exclude": ["node_modules", "dist"]
}

Konfigurationsbeschreibung:

  • target：Ziel-JavaScript-Version, in die kompiliert werden soll
  • module：Zu verwendendes Modulsystem
  • strict：Alle strikten Typprüfungen aktivieren
  • outDir：Ausgabeverzeichnis

Kompilierungszielversion

Verwenden Sie "target", um die JavaScript-Version anzugeben, in die kompiliert werden soll.

Beispiel

// tsconfig.json
{
    "compilerOptions": {
        // ES3, ES5, ES6/ES2015, ES2020, ESNext
        "target": "ES2020"
    }
}

Ausgabeunterschiede für verschiedene Ziele:

// target: ES5 - 使用 var
var greeting = "Hello";

// target: ES2020 - 使用 let/const
let greeting = "Hello";

Modulsystem

Konfigurieren Sie das Modularisierungsschema.

Beispiel

{
    "compilerOptions": {
        "module": "commonjs",
        // Optionen: none, commonjs, amd, umd, es6, es2020, esnext
    }
}

Strict Mode

Die Option strict aktiviert alle strikten Typprüfungen.

Beispiel

{
    "compilerOptions": {
        "strict": true,
        // Entspricht dem Aktivieren aller folgenden Optionen:
        // "strictNullChecks": true,
        // "noImplicitAny": true,
        // "strictFunctionTypes": true,
        // usw.
    }
}

Empfehlung:Aktivieren Sie immer strict: true, dies ist eine Best Practice.

Pfad-Aliase

Konfigurieren Sie Pfad-Aliase, um Importe zu vereinfachen.

Beispiel

{
    "compilerOptions": {
        "baseUrl": ".",
        "paths": {
            "@/*": ["src/*"],
            "@components/*": ["src/components/*"]
        }
    }
}

Verwendung:

import Button from "@components/Button";
import { Header } from "@/components";

Einbeziehung und Ausschluss von Dateien

Legen Sie fest, welche Dateien in die Kompilierung einbezogen werden.

Beispiel

{
    "include": ["src/**/*"],
    "exclude": [
        "node_modules",
        "dist",
        "**/*.test.ts",
        "**/*.spec.ts"
    ]
}

Übersicht über gängige Compiler-Optionen

Option Beschreibung
target Kompilierungszielversion
module Modulsystem
strict Strict Mode
outDir Ausgabeverzeichnis
rootDir Quellstammverzeichnis
esModuleInterop ES-Modul-Interoperabilität zulassen
skipLibCheck Bibliotheksprüfung überspringen
declaration .d.ts-Deklarationsdateien generieren

Zusammenfassung

  • tsconfig.json：TypeScript-Projektkonfigurationsdatei
  • compilerOptions：Kernkonfiguration der Compiler-Optionen
  • include/exclude：Dateibereich steuern
  • Pfad-Aliase:Importpfade vereinfachen
  • strict: true：Strict-Modus immer aktivieren
Andere Erweiterungen