📌 TypeScript Compiler Watch mode
tsc app.ts -w- 시계모드로 해 두면 해당 파일을 컴파일을 계속 하지 않아도 자동으로 컴파일 됨
- 규모가 큰 프로젝트에서는 이렇게 사용하지 않음
🤔 만약 파일이 여러개라면?
// 루트 폴더로 이동해서 하자!
tsc --init
tsc -w- 파일을 지정하지 않아도 시계모드로 프로젝트 전체 폴더를 확인해 변경 사항이 적용될 수 있는 모든 타입스크립트 파일을 다시 컴파일 할 수 있음
🤔 특정한 파일을 컴파일하고 싶지 않다면
- tsconfig.json에 exclude 추가하기
"exclude": ["파일명"] // 추가와일드카드 사용 dev.ts로 끝나는 모든 파일 무시
"exclude": [
"*.dev.ts"
] // 모든 폴더에서 이와 같은 패턴의 파일들 무시
"exclude": [
"`**`/*.dev.ts"
] "exclude": ["node_modules"] // default 설정이라 추가 안 해도 됨
*/📌 compilerOptions
- 타입스크립트 코드를 컴파일되는 방식을 관리한다.
- 어떤 파일을 컴파일할지 컴파일되는 파일이 어떻게 처리되야 하는지 처리할 수 있다
- tsconfig.json의 각각 옵션 오른쪽 주석에 옵션에 대한 설명이 있다
대부분 옵션은 대부분의 프로젝트에서 중요하지 않아 모든 옵션을 설정하거나 고려할 필요가 없다.
🔥 target
- 어떤 자바스크립트 버전을 대상으로 코드를 컴파일할 것인지 TS에 알려줄 수 있다. JS 코드에 존재하지 않는 타입 주석과 같은 새로운 기능만 컴파일하는 것이 아니기 때문이다.
- 따라서 이 옵션은 항목의 작동 여부에 관여하지 않으면 특정 브라우저들에서 실행되는 자바스크립트로 코드를 컴파일한다.
- TS를 컴파일을 하게 된다면 const와 let으로 정의했던 변수가 var로 변환된 것일 간혹 볼 수 있는데 이는 target에 es5가 적용되었을 떄 나타난다. es5에는 let과 const가 포함되지 않기 때문이다.
ctrl + space 키를 눌러서 버전을 선택으로 골라 사용해도 된다 😄
🔥 lib
- dom으로 작업을 수행하는 항목들, 즉 기본 객체, 기능, 타입스크립트 노드를 지정하게 해 주는 옵션이다.
- lib가 설정이 안 되어 있으면 기본 설정은 자바스크립트의 target에 따라 달라진다.
🔥 allowJs, checkJs
- 컴파일시 checkJs와 함께 JS 파일에 포함시킬 수 있다.
- TS가 JS 파일을 컴파일할 수 있도록 해 준다.
- 파일이 .ts로 끝나지 않더라도 TS는 컴파일할 수 있다.
- checkJS를 사용하면 TS는 컴파일을 수행하지 않더라도 구문을 검사하고 잠재적 에러를 보고한다.
- 이 옵션은 TS를 사용하지 않고 일부 기능의 장점만 취하고자 할 떄 유용하다.
- 바닐라 JS 파일과 함께 사용하면서 바닐라 JS 파일도 함께 검사하고 싶은 경우에 사용 가능하다.
🔥 sourceMap
- 디버깅 작업과 개발에 유용
- 값을 true로 설정하고 tsc 커맨드를 다시 실행하면 .js.map 파일이 생성된다.
- 브라우저 개발자 도구 Sources 탭에서 확인해 보면 자바스크립트 파일뿐만 아니라 타입스크립트 파일까지 확인이 가능하다.
🔥 outfile
- 프로젝트가 커질수록 파일을 제대로 정리해야 한다.
- 루트 폴더에는 파일을 생성하지 않고 프로젝트에서는 보통 src 폴너와 dist 폴더를 더 함께 자주 사용하므로 dist 폴더는 모든 출력값을 보관하는 작업을 수행한다.
- outDir
컴파일한 js 파일들을 outDir에 정해둔 값에서 모아서 관리할 수 있다.
- rootDir
src와 같은 파일이 저장되는 폴더에서 구체적으로 설정해 TS 컴파일러가 폴더에서 보이지 않도록 할 수 있다.
🔥 removeComments
-
TS 파일의 모든 주석이 컴파일된 JS 파일에서 제거된다.
noEmit
-
JS 파일을 생성하지 않으려면 true로 설정하면 된다.
🔥 noEmitOnError
- 컴파일 오류 시 파일 방출 중지
false: 에러가 발생하더라도 TS는 원하든 원치 않든 JS 파일을 생성한다.true: 문제가 되는 파일은 생성하지 않는다.
