[TypeScript] 타입스크립트 컴파일러

tsc watch mode

작성 중인 TS 파일에 변경사항이 생기면 이를 반영해서 JS 파일로 자동 변환한다. (watch mode)

$ tsc 파일명.ts -w

다음과 같이 실행하면, 현재 프로젝트 안에 있는 모든 TS 파일을 watch mode로 관리한다.

$ tsc -w

 

 

tsc init

tsconfig.json 파일 생성

$ tsc --init

- 다양한 옵션들을 확인 할 수 있다.

 

 

프로젝트 구조 정리 하기

위의 사진과 같이 JS, TS 파일이 섞여있는 경우에 이를 정리해주는 작업이 필요하다.

이것을 tsconfig에서 조작할 수 있다!

 

outDir 옵션

config안의 outDir 옵션을 찾아서 경로 뒤에 원하는 폴더명을 작성하고 컴파일하면

build 폴더 안에 js 파일들이 생성된 것을 확인할 수 있다.

 

이번엔 src 폴더를 만들어 ts 파일들을 옮기고 tsc를 실행한다.

모든 ts 파일을 포함할 수 있는 상위 폴더부터의 구조가 반영이 된다.

예를들어, 아래와 같은 경우에는 ts 파일을 모두 포함하고 있는 가장 가까운 상위폴더는 프로젝트 루트 폴더이다.

따라서 tsc를 실행하게 되면, 다음과 같이 logging, src 폴더가 담긴 build 폴더가 생성될 것이다.

 

roofDir 옵션

디렉토리 구조를 유지하고 싶을 때는 config의 rootDir 옵션을 사용한다.

rootDir을 ./src로 설정하면,src 폴더 밖에서 ts 파일을 생성하는 것이 불가능해진다.

 

더 많은 컴파일러 옵션들

이외에도 다른 옵션을 추가할 수 있다.

 

https://aka.ms/tsconfig

TSConfig Reference - Docs on every TSConfig option