[解決済み] tsconfigの "target "と "module "を理解する。

質問

以下は、私の tsconfig.json ファイルで、ターゲットを es5 とし、モジュールを es6

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

}

私の質問は、モジュール[import / export]はes6の一部であり、es5ではないので、トランスパイルコードはimport / exportステートメントを持っていないはずです。 しかし、生成されたjavascriptコードは、ターゲットがes5であるにもかかわらず、import / exportステートメントを持っています、それはどのように可能ですか？

どのように解決するのですか？

モジュールシステムは、言語実装から独立しています。ES6 (ES2015) のモジュールでは import / export という構文があり、それを解釈するかどうかはモジュールローダー次第です。

ここでは、ES2015モジュールシステムを使用するように指定しているため、ES6モジュール構文が有効になっています。

JavaScript自体はES5をターゲットとしており、ES5の機能のみを使用していますが、ES2015モジュール構文で動作するコードでモジュールローダーを使用することは理論的には可能です。可能ではありますが、必ずしもそうしたいわけではありません。ES5のJavaScriptでCommonJSまたはAMDモジュールを使用する方が一般的です。

どうやらこの組み合わせは、TypeScript 2.0以前は許されるものでもなかったようです。TypeScript 2.0のリリースノートにはこう書かれています。

"以前は無効なフラグの組み合わせとしてフラグが立っていた、target: es5 と 'module: es6' がサポートされました。これにより、rollup." のような ES2015 ベースのツリー シェイカーの使用が容易になるはずです。