IT

tsconfig의 "target" 및 "module"에 대해

itgroup 2023. 2. 22. 21:43
반응형

tsconfig의 "target" 및 "module"에 대해

아래는 나의tsconfig.json타겟을 설정한 파일es5및 모듈화es6

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

}

모듈 [import/export]는 es6와 NOT es5의 일부이기 때문에 변환된 Javascript 코드는 import/export 스테이트먼트가 없어야 합니다.그러나 생성되는 Javascript 코드는 타겟이 es5인데 Import/export 스테이트먼트를 가지고 있는데 어떻게 가능합니까?

모듈 시스템은 언어 구현과는 독립적입니다.ES6(ES2015) 모듈은import/export해석은 모듈로더에 달려 있습니다.

여기서는 ES2015 모듈 시스템을 사용하여 ES6 모듈 구문을 사용하도록 지정했습니다.

JavaScript 자체는 ES5를 대상으로 하고 ES5 기능만 사용할 수 있지만 이론적으로는 ES2015 모듈 구문과 함께 작동하는 코드를 가진 모듈 로더를 사용할 수 있습니다.가능하긴 하지만 꼭 하고 싶은 일은 아니다.공통을 사용하는 것이 일반적입니다.ES5 JavaScript 탑재 JS 또는 AMD 모듈

이 조합은 TypeScript 2.0 이전에는 허용되지 않았다고 합니다.TypeScript 2.0 릴리즈 노트에는 다음과 같이 기재되어 있습니다.

"이전에는 유효하지 않은 플래그 조합으로 플래그가 지정되었지만 이제 target: es5와 'module: es6'이 지원됩니다.그러면 롤업과 같은 ES2015 기반의 트리 셰이커를 쉽게 사용할 수 있을 것입니다."

이전 답변을 보완하기 위해 2020년에는 모듈 분해능 및 컴파일 출력을 정의하는 4가지 TS 구성 옵션이 있습니다.

  • module.
  • target.
  • lib.
  • moduleResolution.

첫 번째 3개는 출력에 영향을 주고, 두 번째 3개는 컴파일러가 모듈을 검색하여 해결 및 번들하는 방법에 영향을 줍니다.

다음은 이러한 옵션에 대한 간결한 기사입니다.타이프 스크립트의 혼란:tsconfig.json module, module Resolution, target & lib 설명| Tom Medema | Medium |

또한 모듈 해결에 관한 문서:Type Script: 핸드북 - 모듈 해상도

언급URL : https://stackoverflow.com/questions/41993811/understanding-target-and-module-in-tsconfig

반응형