typescript - Razumijevanje "target" i "module" u tsconfig

Ispod je moja datoteka tsconfig.json u kojoj sam postavio target na es5 i module na es6

{
   "compilerOptions": {
   "target": "es5",    
   "module": "es6"
   }

}

Moje pitanje je zato što su moduli [import/export] dio ES6 i NISU dio ES5, pa transpilirani JavaScript kod ne bi trebao imati import/export izjave. Ali JavaScript kod koji se generira ima import/export izjave iako je cilj ES5, kako je to moguće?

Odgovor #1

Sustav modula je neovisan o implementaciji jezika. ES6 (ES2015) moduli koriste import/export sintaksu, a na učitavaču modula je da to interpretira.

Ovdje ste naveli korištenje ES2015 modulskog sustava, što omogućuje ES6 sintaksu modula.

Sami JavaScript može ciljati ES5 i koristiti samo ES5 značajke, ali je teorijski moguće koristiti učitavač modula s tim kodom koji radi s ES2015 sintaksom modula. Iako je moguće, to nije nužno nešto što biste željeli raditi. Češće je koristiti CommonJS ili AMD module s ES5 JavaScriptom.

Očito ova kombinacija nije bila dopuštena čak ni prije TypeScript 2.0. U bilješkama o izdanju TypeScript 2.0 stoji:

"Ranije označeno kao nevažeća kombinacija zastavica, cilj: es5 i 'module: es6' sada je podržano. To bi trebalo olakšati korištenje tree shakera baziranih na ES2015, kao što je rollup."

Odgovor #2

Kao dopunu prethodnom odgovoru, u 2020. postoje 4 TS konfiguracijske opcije koje definiraju razrješenje modula i izlaz kompilacije:

  • modul.
  • cilj.
  • lib.
  • moduleResolution.

Prva tri utječu na vaš izlaz, dok posljednje utječe na način na koji prevodilac traži vaše module da ih riješi i spoji.

Evo odličnog i sažetog članka o ovim opcijama: Typescript zbrka: tsconfig.json module, moduleResolution, target i lib objašnjeno | autor Tom Medema | Medium.

Dodatno, dokument o rješavanju modula: TypeScript: Priručnik - Rješavanje modula.

Povezani članci