[TypeScript] 컴파일러 옵션

타입스크립트 컴파일러 옵션 설정하기

컴파일러 옵션이란?

• 얼마나 엄격하게 타입 오류를 검사할 것인가?
• 자바스크립트 코드의 버전은 어떻게 할 것인가?
• ... 등등

컴파일러 옵션은 Node.js 패키지 단위(프로젝트 단위)로 설정할 수 있다.

1. 자동 설정

TSC 도구 사용하여 컴파일러 옵션 파일을 자동으로 생성한다.

tsc --init

# Created a new tsconfig.json with:
# target: es2016
# module: commonjs
# strict: true
# esModuleInterop: true
# skipLibCheck: true
# forceConsistentCasingInFileNames: true

• 기본적인 옵션이 자동으로 설정된 tsconfig.json 파일을 생성한다.

2. 직접 설정

tsconfig.json 파일을 생성한 후, 필요한 옵션을 직접 설정한다.

{
  "compilerOptions": {
    "skipLibCheck": true, // 타입 정의 파일의 타입 검사를 생략하는 옵션
    "target": "ESNext", // JavaScript의 최신 버전
    "module": "ESNext", // ES Module 모듈 시스템
    "outDir": "dist",
    "strict": false,
    "moduleDetection": "force"
  },
  "include": ["src"]
}

include

• TSC가 컴파일할 .ts 파일들의 범위와 위치를 알려주는 옵션
• "include": ["src"]으로 설정하면,
  src 디렉토리 하위의 모든 파일을 컴파일한다.

target

• 컴파일 해서 만들어지는 JavaScript 코드의 버전을 설정하는 옵션
• "compilerOptions": {} 항목 안에 설정해야 한다.
  • "compilerOptions" : TypeScript를 JavaScript로 변환하는 과정이나, Type 검사 등 아주 상세한 옵션을 설정하는 항목
• "target": "ES5"로 설정하면, JavaScript의 ES5 버전으로 컴파일 된다.

module

• JavaScript 코드의 모듈 시스템을 설정하는 옵션
• "compilerOptions": {} 항목 안에 설정해야 한다.
• "module": "CommonJS로 설정하면, 컴파일 시 CommonJS의 모듈 시스템으로 변환된다.

outDir

• 컴파일 된 파일이 어디에 위치할지 설정하는 옵션
• "compilerOptions": {} 항목 안에 설정해야 한다.
• "outDir": "dist"로 설정하면, 컴파일 결과가 dist 디렉토리 안에 생성된다.

strict

• 타입 검사 시, 컴파일러가 얼마나 엄격하게 검사할지 결정하는 옵션
• "compilerOptions": {} 항목 안에 설정해야 한다.
• "strict": true로 설정하면, strict 모드가 활성화된다.
• 추론되지 않는 변수의 타입을 명시하지 않을 경우, strict 모드로 인해 오류가 발생한다.
• TypeScript에서는 매개변수의 타입을 프로그래머가 직접 지정하는 것을 권장한다.

moduleDetection

• 모듈 시스템 코드를 자동으로 추가해주는 옵션
• "compilerOptions": {} 항목 안에 설정해야 한다.
• "moduleDetection": "force"로 설정하면, export {} (모듈 시스템 코드)를 자동으로 추가해준다.