Para que serve o target em tsconfig.json?

95

O que significa targetin tsconfig.json?

{
  "compilerOptions": 
  {
    "sourceMap": true,
    "target": "es5",
    "module": "commonjs",
    "jsx": "react",
    "moduleResolution": "classic",
    "lib": [ "es2015", "dom",  "es2017" ]
  }
}
typescript tsconfig transpiler Ankit Raonka
fonte

Respostas:

112

Eu sou muito novo no Typescript. O que significa Target em tsconfig.json?

targetsignifica qual destino de JavaScript deve ser emitido a partir do TypeScript fornecido . Exemplos:

target:es5

()=>nullse tornará function(){return null}como ES5 não tem funções de seta.

target:es6

()=>nullse tornará ()=>nullcomo ES6 tem funções de seta.

Basarat
fonte
5
eu ainda preciso do babel se eu tiver como destino es5 também meu código de texto digitado contém async e await, isso compilará se eu der o destino como es5?
Ankit Raonka
4
Não precisa de babel para isso 🌹
basarat
Eu estava usando, es5mas ele interpreta a desestruturação [...arr].mapcomo arr.slice().map, que quebra para um objeto semelhante a uma matriz que não tem slice. Quando eu direciono o es6, ele começa a funcionar no meu navegador, mas funcionará para todos?
Qwerty
1
@Qwerty Não, não vai. Por exemplo, não funcionará no Internet Explorer 11, já que ele não oferece suporte a es6 e não possui a função .map. Mesmo se você direcionar o es5, ele AINDA não funcionará no Internet Explorer, porque não é trabalho do transpiler adicionar polyfills. Você ainda precisa adicionar um polyfill se quiser oferecer suporte a navegadores que não sejam ES6.
pabrams
1
@Qwerty Bem, o que estou dizendo é que a transpilação do Typescript não faz o polyfill dos métodos ausentes para você, ela apenas cuida da sintaxe. Este tópico explica muito bem: github.com/frankwallis/plugin-typescript/issues/166
pabrams
10

O destino muda a versão do JavaScript para a qual você está compilando.

As opções estão disponíveis em https://www.typescriptlang.org/docs/handbook/compiler-options.html

No espírito de tentar entender melhor como o sinalizador de destino muda meu código, eu compilei alguns códigos de teste para cada uma das diferentes versões para ter um melhor entendimento das diferenças.

https://github.com/aizatto/typescript-playground/tree/master/dist/test-async-main

Também estou anotando o que devo almejar, dependendo de qual ambiente estou olhando

https://www.aizatto.com/notes/typescript

aizatto
fonte