타입스크립트 컴파일러

tsc app.ts -w

해당 파일은 관찰 모드로 진입하며 여기서 변경 사항이 생길 때마다 디스크에 있는 파일 역시 저장되고 자동으로 다시 컴파일됩니다.

관찰 모드는 우수한 기능이지만 파일을 구체적으로 지정해야 한다는 번거로움이 있습니다.

index.html

<head>
...
<script src="app.js" defer></script>
<script src="analytics.js" defer></script>
...
</head>

html 파일에 필요한 파일을 연결하고 터미널에 tsc를 입력하면 연결된 모든 파일이 자동으로 관찰되게 할 수 있습니다.

이 프로젝트를 타입스크립트 프로젝트라고 처음에 지정하면서 한 번만 실행하면 됩니다.

실행하면 tsconfig.json 파일이 생성됩니다.

이 파일은 타입스크립트가 관리해야 하는 이 파일이 포함된 프로젝트와 이 폴더의 모든 하위 폴더를 참고하기 위한 폴더입니다.

그다음에는 tsc만 입력하면 모든 타입스크립트 파일을 컴파일하게 됩니다.

"exclude": [
  "analytics.ts"
]

이렇게 tsconfig.json에 적어 컴파일 대상을 제외할 수 있습니다.

"exclude": [
  "*.dev.ts"
]

이렇게 *를 이용하여 dev.ts가 포함된 모든 파일을 제외하게 할 수 있으며

"exclude": [
  "**/*.dev.ts"
]

**/도 추가하면 모든 폴더에서 이와 같은 패턴의 파일을 무시할 수 있게 됩니다.

"exclude": [
  "node_modules"
]

일반적으로 성능 향상을 위해 node_modules를 컴파일에서 제외하지만 이것만 제외할 경우 기본값이기에 쓰지 않아도 됩니다.

"include": [
  "app.ts"
]

이렇게 컴파일할 대상만 포함시킬 수 있지만 include를 설정할 경우 컴파일하고자 하는 모든 항목을 포함시켜야 합니다.

추가적인 tsconfig 설정 내용들은 아래의 링크에서 확인할 수 있습니다.

TypeScript 한글 문서

TypeScript 한글 번역 문서입니다

typescript-kr.github.io