지난 글에서 타입스크립트 프로젝트를 생성하고 컴파일 했었는데 내용을 보면 수상한 점이 있다.

타입스크립트 index.ts의 내용

분명 나는 const hello를 arrow function으로 생성 했지만 

컴파일된 index.js의 내용

var hello의 일반 function으로 컴파일 되어 있다.

이것은 타입스크립트가 어디서든 호환되는 하위 버전의 자바스크립트로 컴파일 하기 때문인데

타입스크립트의 코드가 어떤 버전의 자바스크립트로 바뀔지 정해줄 수 있다.

디폴트는 es3 or es5 (arrow function은 es5 이상에서 생긴다.)

 

지난 시간에 컴파일된 파일을 어디에 저장할지 정해주었던 compilerOptions에서 target을 지정해주면 된다.

"target": "es3 -> es6"
새롭게 컴파일된 index.js 내용

index.js의 파일도 arrow function으로 컴파일 된 것을 확인할 수 있다!!

'typescript' 카테고리의 다른 글

[typescript] typescript 프로젝트 생성하기  (0) 2023.04.24

최근 react나 next를 공부하다가 타입스크립트를 같이 공부하게 되었다.

그냥 파일 이름을 .ts로 해주면 될 줄 알았는데 아니였나보다. ㅋㅋㅋㅋㅋ

 

--우선 프로젝트 폴더에 npm을 초기화 시켜주고

npm init -y

--타입스크립트를 설치해준다

npm i -D typescript

--그리고 폴더에 tsconfig.json 파일 생성 후 설정

 

tsconfig.json 파일 내용

include = 자바스크립트로 컴파일할 타입스크립트 폴더 ex) src

compilerOptions : "outDir" = 컴파일 된 자바스크립트 파일을 저장할 폴더 이름

 

그 후 package.json 파일도 수정

package.json 파일 수정

build를 실행하면 tsc가 실행된다.

 

npm run build 실행결과

run build 실행 결과

컴파일된 js가 build 폴더 아래 생성된 것을 확인할 수 있다!

'typescript' 카테고리의 다른 글

[typescript] typescript 프로젝트 target 설정  (0) 2023.04.24

+ Recent posts