Unten ist meine tsconfig.jsonDatei, in der ich das Ziel es5und das Modul festgelegt habees6
{
"compilerOptions": {
"target": "es5",
"module": "es6"
}
}
Meine Frage ist, weil Module [Import / Export] Teil von es6 und NICHT es5 sind, sollte der transpilierte Javascript-Code keine Import / Export-Anweisungen enthalten. Aber der generierte Javascript-Code enthält Import / Export-Anweisungen, obwohl das Ziel es5 ist. Wie ist das möglich?
Antworten:
Das Modulsystem ist unabhängig von der Sprachimplementierung. ES6 (ES2015) -Module verwenden die import/ -Syntax export, und es ist Sache des Modulladers , dies zu interpretieren.
Hier haben Sie mit dem ES2015-Modulsystem angegeben, damit die ES6-Modulsyntax aktiviert wird.
Das JavaScript selbst zielt möglicherweise auf ES5 ab und verwendet nur ES5-Funktionen. Theoretisch ist es jedoch möglich, einen Modullader mit diesem Code zu verwenden, der mit der ES2015-Modulsyntax arbeitet. Obwohl es möglich ist, ist es nicht unbedingt etwas, was Sie tun möchten. Es ist üblicher, CommonJS- oder AMD-Module mit ES5-JavaScript zu verwenden.
Anscheinend war diese Kombination vor TypeScript 2.0 nicht einmal erlaubt. In den Versionshinweisen zu TypeScript 2.0 heißt es:
"Früher als ungültige Flaggenkombination gekennzeichnet, werden jetzt target: es5 und 'module: es6' unterstützt. Dies sollte die Verwendung von ES2015-basierten Baumschüttlern wie Rollup erleichtern."
Ergänzend zur vorherigen Antwort gibt es im Jahr 2020 4 TS-Konfigurationsoptionen, die die Modulauflösung und die Kompilierungsausgabe definieren:
module.target.lib.moduleResolution.Die ersten 3 wirken sich auf Ihre Ausgabe aus, während die letztere die Art und Weise beeinflusst, wie der Compiler nach Ihren Modulen sucht, um sie aufzulösen und zu bündeln.
Hier ist ein großartiger und prägnanter Artikel über diese Optionen: Typoskript-Verwirrung: tsconfig.json-Modul, moduleResolution, target & lib erklärt | von Tom Medema | Mittel .
Zusätzlich ein Dokument zur Modulauflösung: TypeScript: Handbuch - Modulauflösung .