Les fonctions ES6 sont-elles compilées en ES5 lorsqu'elles sont utilisées avec TypeScript?

Question

Lorsque j'utilise des fonctionnalités ES6 comme par exemple une chaîne de modèles, des fonctions de flèches, une déstructuration dans un fichier TypeScript. Ensuite, je compile le fichier en JavaScript normal ...

La syntaxe ES6 est-elle compilée aussi par le compilateur TypeScript? Ou dois-je utiliser un compilateur supplémentaire (Babel)?

Answer 1

Vous avez besoin de compilateurs supplémentaires qui permettent d'exporter votre code de ES6 vers ES5. Type12 est assez intelligent et fera la plupart du travail pour vous (c'est-à-dire traduire let en var ou des fonctions fléchées vers des fonctions standard avec une portée et des liaisons correctes).

EDIT: comme l'a souligné @Paleo, sur 99%, vous n'avez besoin d'aucun compilateur externe car vous pouvez fournir à TypeScript une bibliothèque supplémentaire (polyfill) qui rendra tout bon travail.

Vous aurez besoin d'un compilateur supplémentaire dans de très rares cas lorsque vous n'êtes pas couvert par transpiler ni par polyfill.

Answer 2

La syntaxe ES6 est-elle également compilée par le compilateur TypeScript? Ou dois-je utiliser un compilateur supplémentaire (Babel)?

Je ne suis pas d'accord avec la réponse de Fylax. Le compilateur dactylographiée ne nécessite pas un outil supplémentaire pour convertir la syntaxe ES6 à 3 ES ou 5.

Le compilateur dactylographiée tranpiles la nouvelle syntaxe (let, for … of, les fonctions de direction, les paramètres de repos, etc.) à 3 ES ou 5. Mais il ne fournit pas de polyfill par lui-même. Pour utiliser une API récente (comme Promise) sur une ancienne machine virtuelle ES 3 ou 5, vous devez:

1. Charge un polyfill (comme es6-promise) qui rend l'API disponible;
2. Dites au compilateur d'utiliser les typings standard pour cette API.

Il s'agit d'une option de conception robuste. Avec le typage, vous devez choisir avec soin les polyfills dont vous avez besoin et les tester sur les différents navigateurs que vous ciblez.

Par défaut, lorsque la cible est ES 3 ou ES 5, le compilateur n'utilise pas les définitions de l'API ECMAScript récente. Voir the documentation:

Note: Si --lib n'est pas spécifié une bibliothèque par défaut est injecté. La bibliothèque par défaut est injecté:

► Pour --target ES5: dom,es5,scripthost

Si un polyfill fait une API disponible, nous pouvons configurer le compilateur pour l'utiliser. Voici un exemple de fichier de configuration tsconfig.json pour l'utilisation de promesses sur ES5 VM:

{ 
    "compilerOptions": { 
    "target": "es5", 
    "lib": ["dom", "es5", "es2015.promise"] 
    } 
} 

Cependant, Babel peut convertir plus de fonctionnalités à 5 ES que tapuscrit ne. Voir the compatibility table from Kangax.[OMI, Babel fait plus avec la quantité lessquality.]