EN · DE · RU · FR · ES

#2764: tsconfig.json

projectforge-webapp/tsconfig.json TypeScript-Compiler-Konfiguration · projectforge-webapp/tsconfig.json 35 Zeilen · 35 Code · 0 Kommentare · 0 leer
Die TypeScript-Compiler-Konfiguration für die ProjectForge-React-Webanwendung. Steuert alle Aspekte der Typprüfung, Modulauflösung, JSX-Transpilierung und Dateieinbindung für das Frontend-Codebase. Ursprünglich auf ES5 mit klassischem React-JSX und CRA-kompatibler Modulauflösung (node) ausgelegt, hat es sich über vier bedeutende Iterationen weiterentwickelt, um moderne ESNext-Ausgabe, die neue JSX-Transformation (react-jsx), bundlerbasierte Modulauflösung und Vite-Kompatibilität zu unterstützen.

Architektur

Wichtige Einstellungen und ihre Entwicklung

Ziel (Target): Begann bei es5 (der CRA-Standard für maximale Browserkompatibilität), wurde während der Vite-Migration auf esnext aktualisiert. Vite übernimmt die Transpilierung für bestimmte Browserziele separat, sodass die TypeScript-Ebene die neuesten JS-Funktionen anvisieren kann.

Modulauflösung: Geändert von node (CRA-Standard, löst Module mit dem Node.js-Auflösungsalgorithmus auf) zu bundler (Vite-kompatibel, versteht das exports-Feld in package.json und bedingte Exporte). Dies war die folgenreichste Änderung der Migration – die node-Auflösung konnte einige Pakete im ESM-first-Kontext von Vite nicht auflösen.

JSX: Ursprünglich wurden sowohl "jsx": "react" als auch "jsx": "react-jsx" verwendet (doppelte Einträge – ein CRA-Überbleibsel), bereinigt auf nur "react-jsx". Dies ermöglicht die neue JSX-Transformation (React 17+), bei der import React from 'react' nicht mehr in jeder JSX-Datei erforderlich ist.

Einbindungsmuster (Include): Entwickelte sich von einem pauschalen "src" zu expliziten Glob-Mustern (src/**/*.tsx, src/**/*.ts, src/**/*.js usw.), wurde dann um .d.ts-Dateien und react-app-env.d.ts erweitert und schließlich durch vite-env.d.ts ersetzt, das die CRA-Deklaration ablöste.

Strikter Modus: Von Anfang an aktiviert ("strict": true), bietet Nullprüfungen, strenge Funktionstypen und strenge Eigenschaftsinitialisierung im gesamten Frontend-Codebase.

Git-Verlauf

CommitWas sich geändert hat
bf988bc6dDrei Änderungen für die Vite-Migration: (1) target von es5 auf esnext aktualisiert – Vite kümmert sich um die Browserkompatibilität, nicht TypeScript; (2) moduleResolution von node auf bundler geändert – erforderlich für Vites ESM-first-Modulverarbeitung; (3) Eintrag in der Include-Liste von src/react-app-env.d.ts auf src/vite-env.d.ts geändert – Anpassung an das neue Build-Tool.
f867698d3Die include-Muster wurden erweitert, um src/**/*.ts, src/**/*.d.ts abzudecken, und src/react-app-env.d.ts wurde explizit hinzugefügt. Dies war notwendig, da das Codebase begann, TypeScript neben bestehenden JavaScript-Dateien zu verwenden, und der Compiler die neuen .ts- und Deklarationsdateien berücksichtigen musste.
87c1212c2Entfernte den doppelten Eintrag "jsx": "react" (belässt nur "jsx": "react-jsx" am Ende). Änderte include von der pauschalen Angabe "src" zu spezifischen Glob-Mustern (src/**/*.tsx, src/**/*.js, src/**/*.jsx, src/**/*.scss) und fügte einen exclude-Eintrag für node_modules hinzu. Dies war Teil der Arbeit an der Multi-Upload-Funktion und straffte die Build-Konfiguration.
377b3e3acErstellte die erste tsconfig.json für die Webanwendung. Legte die Basiskonfiguration mit es5-Ziel, CRA-kompatiblen Einstellungen, den doppelten jsx-Einträgen und dem einfachen Muster "include": ["src"] fest. Dies war der Ausgangspunkt, als das React-Frontend erstmals in das ProjectForge-Monorepo eingeführt wurde.