Ist es möglich, mehrere Ziele in CompilerOptionen zu haben?

Question

Sorry, wenn dies eine Nobb Frage, aber ich baue eine Angular App und meine aktuelle tsconfig.json Datei hat ‚es6‘ als ‚Ziel‘ in ‚Compiler‘:

{ 
    "compilerOptions": { 
    "target": "es6", 
    "module": "commonjs", 
    "moduleResolution": "node", 
    "sourceMap": true, 
    "emitDecoratorMetadata": true, 
    "experimentalDecorators": true, 
    "removeComments": false, 
    "noImplicitAny": false, 
    "types" : [] 
    }, 
    "exclude": [ 
    "node_modules" 
    ] 
} 

Ist es möglich, mehrere Ziele haben? Kann ich zum Beispiel in es5 hinzufügen? Ich frage einfach, weil ich Tutorials durchlese, die für es5 geschrieben sind, aber aufgrund des aktuellen Stands meines Projekts muss ich es6 verwenden - d. H. Ich kann nicht downgraden. Mein gesamter Code muss mit es6 übereinstimmen - wenn beide enthalten wären, würde ich mir vorstellen, dass mein Code sowohl zu es5 als auch zu es6 passt.

Answer 1

Sie können nur einentarget für die Konfiguration angeben. Die target-Eigenschaft von compilerOptions akzeptiert einen einzelnen Zeichenfolgenwert.

Angeben ES5 als das Ziel würde nicht Sie beschränkt von der Quelle in ES6 Schreiben oder höher ist, stellt sicher, es ist einfach, dass der kompilierte Code mit Clients kompatibel ist, die nur ES5 oder weniger verstehen. Features wie Lambda-Ausdrücke werden zu Funktionsausdrücken kompiliert.

Ein Ausdruck wie const foo = (bar) => bar.replace('\t', ''); würde zu var foo = function (bar) { return bar.replace('\t', ''); }; mit Ziel auf ES5 kompiliert werden.

Wenn das Ziel, das zu ES5 oder ES6 kompiliert werden soll, wirklich davon abhängen würde, welche Geräte/Browser Ihre Anwendung verwenden, wäre ES5 zu diesem Zeitpunkt definitiv eine "sicherere" Wahl in Bezug auf Kompatibilität. Hier ist eine nette Quelle für die Bestimmung ES6 browser comparability.

Hoffentlich hilft das zur Klärung!

Answer 2

Denken Sie daran, dass Sie auch mehrere tsconfig-Dateien erstellen und die extends-Funktion verwenden können, um ein Basis-tsconfig zu erstellen, das die meisten Elemente abdeckt, und dann zwei Ziel-tsconfigs, die die Ziele abdecken.

Basis TSconfig:

{ 
    "compilerOptions": { 
    "module": "commonjs", 
    "moduleResolution": "node", 
    "sourceMap": true, 
    "emitDecoratorMetadata": true, 
    "experimentalDecorators": true, 
    "removeComments": false, 
    "noImplicitAny": false, 
    "types" : [] 
    }, 
    "exclude": [ 
    "node_modules" 
    ] 
} 

ES5 TSconfig:

{ 
    "extends": "./base.json" 
    "compilerOptions": { 
     "target": "es5" 
    } 
} 

ES6 TSconfig:

{ 
    "extends": "./base.json" 
    "compilerOptions": { 
     "target": "es6" 
    } 
} 

Dann würden Sie nur laufen müssen je nachdem, was Ziel Sie brauchen: tsc -p ./es6.json

Das bedeutet nicht, dass Ihr Code beiden gleichzeitig entspricht; Sie können jedoch optional eine outDir-Eigenschaft zu jedem tsconfig hinzufügen, das die Basis erweitert, und die Ausgabe in separate Verzeichnisse kompilieren.