TIL - TypeScript 컴파일러, tsc 설정변경!

컴파일러란 특정 트로그래밍 언어가 *정적 언어로서의 정체성을 유지할 수 있게 하는 도구로, 
프로그래밍 언어로 작성된 소스 코드를 다른 프로그래밍 언어로 변환한다.
사전 의미를 생각하면 컴퓨터 언어를 다른 프로그래밍 언어로 엮어낸다고 이해할 수 있겠다?

tsc = TypeScript Compiler

*정적언어(=컴파일 언어)는 기계어로 변환되어야 하고

동적언어(=인터프리터 언어)는 엔진이 코드를 한줄씩 실행하면서 동적으로 해석을 하기 때문에 미리 오류 검출 어려워지고 실행하다가 오류가 난다(Runtime Error)

→ JavaScript는 동적언어(인터프리터 언어)이기 때문에 기계어로 변환 될 필요가 없다.

 

tsc 주요 명령어

tsc --init
: tsconfig.json이 생성

tsc index.ts
: index.ts를 컴파일
: .ts는 TypeScript 파일의 확장자

tsc src/*.ts
: src 디렉토리 안에 있는 모든 TypeScript 파일을 컴파일

tsc index.js --declaration --emitDeclarationOnly
: @types 패키지를 위한**.d.ts 파일 생성**
: TypeScript로 작성된 모듈이 아니라 JavaScript로 작성된 모듈에 타입 선언을 제공할 때 유용

tsc 명령어 docs

Documentation - tsc CLI Options

---

tsconfig.json

1. tsc --init 명령 후 생성되는 파일
2. TypeScript 프로젝트 설정 파일
3. 주로 프로젝트의 컴파일 옵션 및 이력 파일들을 정의

 

설정 변경

• compilerOptions - strict
  • 엄격한 타입검사 옵션을 모두 활성화
• strictNullChecks
• strictFuntionTypes
• strictBindCallApply
• strictPropertyInitialization
• noImplictAny
  • 함수의 인자 또는 변수의 타입이 영시적으로 선언되지 않은경우 컴파일러가 자동으로 any 타입 부여하지 않도록 세팅
  • 개발자가 누락된 타입선언을 확인하고 명시적으로 타입을 선언 가능
• noImplicitThis
• alwaysStrict
• compilerOptions - sourceMap
  • 컴파일된 JavaScript 파일에 대한 소스 맵을 생성
  • 실행 중 에러가 발생했을 때 TyptScript 소스 코드의 위치를 바로 확인 가능
  • 코드 디버깅에 큰 도움! 개발환경에서 특히 반드시 true로 설정 !프로덕션 환경에서는 용량이나 성능상의 이유로 sourceMap을 사용하지 않는 것이 better.

→ 위 옵션들은 모두 true 설정 권장

 

include, exclude 옵션

tsc가 컴파일을 할 때 포함하거나 제외할 파일이나 디텍터리 지정 옵션

"include": ["src/**/*"]

: src 디렉토리 밑의 파일들을 컴파일 하겠다는 뜻

"exclude": ["node_modules", "dist"]

:node_modules, dist 디렉토리 밑의 파일들은 컴파일 대상에서 제외하겠다는 뜻