⚡

TSConfig Generator

Generiere tsconfig.json für jedes TypeScript-Projekt. Presets für Node 18/20/22, Next.js, React, Bibliotheken — mit Erklärung jeder Compiler-Option.

Comma-separated glob patterns

Comma-separated glob patterns

Uber dieses Tool

Die tsconfig.json-Datei steuert, wie der TypeScript-Compiler deinen Code verarbeitet — welche JavaScript-Version als Ziel, welches Modulsystem verwendet wird, wie streng die Typprüfung sein soll und wo die Quelldateien zu finden sind. Die richtige tsconfig-Konfiguration ist wichtig. Ein falsch konfiguriertes Target bedeutet, dass du Polyfills auslieferst, die du nicht brauchst, oder Syntax verwendest, die deine Laufzeitumgebung nicht unterstützt. Falsche Modul-Einstellungen brechen Imports. Fehlende Strict-Flags lassen Bugs durchschlüpfen. Dieser Generator bietet dir kampferprobte Presets für die gängigsten Setups — Node.js (18, 20, 22), Next.js, React mit Vite und npm-Bibliotheken — und ermöglicht dann die Feinabstimmung jeder Option. Die generierte Konfiguration ist bereit zum Einfügen in dein Projekt.

Anleitung

1. Wähle ein Preset, das zu deinem Projekt passt (Node 20, Next.js, React, etc.) 2. Passe einzelne Compiler-Optionen bei Bedarf an — target, module, strictness, paths 3. Die tsconfig.json wird in Echtzeit aktualisiert, wenn du Einstellungen änderst 4. Klicke auf "Kopieren", um die Konfiguration in die Zwischenablage zu kopieren, oder "Herunterladen", um die Datei zu speichern 5. Füge sie als tsconfig.json in dein Projektstammverzeichnis ein

Haufig gestellte Fragen

Welche tsconfig sollte ich für Node 18 verwenden?
Für Node 18 verwende target: ES2023, module: NodeNext und moduleResolution: NodeNext. Dies entspricht Node 18s nativer JavaScript-Unterstützung und dem ESM-Modulsystem. Das Node 18 Preset in diesem Generator setzt alle diese Optionen automatisch.
Was ist der Unterschied zwischen module NodeNext und ESNext?
NodeNext folgt den Node.js-Modulauflösungsregeln — es respektiert package.json 'exports' und erfordert Dateierweiterungen in Imports. ESNext geht davon aus, dass ein Bundler (wie Vite oder webpack) die Modulauflösung übernimmt. Verwende NodeNext für Node.js-Apps, ESNext für gebündelte Frontend-Apps.
Was macht moduleResolution Bundler?
moduleResolution: Bundler weist TypeScript an, Imports so aufzulösen, wie moderne Bundler (Vite, webpack, esbuild) es tun — keine Dateierweiterungen erforderlich, package.json 'exports' wird unterstützt. Verwende es für Frontend-Projekte, die mit einem Bundler erstellt werden. Verwende es nicht für Node.js-Apps, die ohne Bundler laufen.
Sollte ich den strict-Modus aktivieren?
Ja, für jedes neue Projekt. Der strict-Modus aktiviert strictNullChecks, noImplicitAny, strictFunctionTypes und andere Prüfungen, die echte Bugs finden. Das Deaktivieren von strict bei Legacy-Codebasen ist verständlich, aber neue Projekte sollten immer mit strict: true starten.
Was ist der Unterschied zwischen target und lib?
target steuert, welche JavaScript-Syntax der Compiler ausgibt (Arrow-Functions, async/await, etc.). lib steuert, welche Typdefinitionen verfügbar sind (Promise, Map, DOM-APIs, etc.). Für Node.js möchtest du typischerweise lib: ['ES2023'] ohne DOM. Für Browser fügst du 'DOM' und 'DOM.Iterable' hinzu.
Brauche ich skipLibCheck: true?
skipLibCheck: true überspringt die Typprüfung von .d.ts-Deklarationsdateien, was die Kompilierung erheblich beschleunigt. Es wird für die meisten Projekte empfohlen, da Deklarationsdateien aus node_modules konfliktreiche Typen haben können, die nicht dein Problem sind zu beheben.
Was macht verbatimModuleSyntax?
verbatimModuleSyntax erzwingt, dass du 'import type' für reine Typ-Imports verwendest und behält deine Import/Export-Syntax genau wie geschrieben bei. Es ersetzt die älteren importsNotUsedAsValues- und preserveValueImports-Optionen. Es ist der moderne Weg, Typ-Imports in TypeScript 5+ zu handhaben.

Verwandte Tools

.gitignore Generator

Generiere .gitignore-Dateien durch Kombinieren von Vorlagen für Programmiersprachen, Frameworks, IDEs und Betriebssysteme

Robots.txt Generator

Generiere robots.txt-Dateien mit visuellem Editor. Blockiere Bots, setze Crawl-Regeln, füge Sitemaps hinzu — mit Vorlagen für gängige Setups.

Htaccess Redirect Generator

Generiere .htaccess Redirect-Regeln — 301, 302, HTTPS, www und kanonische Weiterleitungen