# 자주 사용하는 `tsconfig.json` 속성 정리

타입스크립트 프로젝트에서 `tsconfig.json` 파일은 컴파일러의 동작을 정의하는 중요한 설정 파일입니다. 이 글에서는 `tsconfig.json`에서 자주 사용하는 속성들을 설명하고, 각각의 역할을 알아보겠습니다.

---

## 1. `compilerOptions`
`compilerOptions`는 타입스크립트의 컴파일러 설정을 정의하는 가장 중요한 속성입니다.

### 필수적으로 알아야 할 주요 옵션

#### 1) `target`
컴파일된 자바스크립트 코드가 어떤 ECMAScript 버전을 따를지 설정합니다.
```json
"target": "ES6"
```
- `ES5`, `ES6`(ES2015), `ES2017`, `ES2020` 등의 값을 가질 수 있으며, 최신 기능을 사용하고 싶다면 `ESNext`를 설정할 수도 있습니다.

#### 2) `module`
모듈 시스템을 지정합니다.
```json
"module": "CommonJS"
```
- 브라우저 환경에서는 `ESNext`, `ES6`
- Node.js 환경에서는 `CommonJS`를 주로 사용합니다.

#### 3) `strict`
타입스크립트의 엄격한 타입 체크 기능을 활성화합니다.
```json
"strict": true
```
- `true`로 설정하면 `noImplicitAny`, `strictNullChecks` 등 다양한 엄격한 타입 검사를 적용합니다.

#### 4) `allowJs`
자바스크립트 파일(`.js`)도 타입스크립트 프로젝트에서 사용할 수 있도록 허용합니다.
```json
"allowJs": true
```

#### 5) `outDir`
컴파일된 자바스크립트 파일을 저장할 디렉토리를 지정합니다.
```json
"outDir": "./dist"
```

#### 6) `rootDir`
컴파일할 소스 코드의 루트 디렉토리를 지정합니다.
```json
"rootDir": "./src"
```

#### 7) `noImplicitAny`
암시적으로 `any` 타입이 사용되는 것을 방지합니다.
```json
"noImplicitAny": true
```
- 미리 타입을 명확하게 지정하도록 강제하여 버그를 줄일 수 있습니다.

#### 8) `strictNullChecks`
`null`과 `undefined`를 엄격하게 체크합니다.
```json
"strictNullChecks": true
```

#### 9) `noUnusedLocals`, `noUnusedParameters`
사용하지 않는 변수나 매개변수가 있을 경우 경고를 발생시킵니다.
```json
"noUnusedLocals": true,
"noUnusedParameters": true
```

---

## 2. `include`와 `exclude`
### 1) `include`
컴파일할 파일 또는 디렉토리를 지정합니다.
```json
"include": ["src"]
```

### 2) `exclude`
컴파일에서 제외할 파일 또는 디렉토리를 지정합니다.
```json
"exclude": ["node_modules", "dist"]
```

---

## 3. `extends`
기본 `tsconfig.json`을 확장하여 사용합니다.
```json
"extends": "@tsconfig/recommended"
```

---

## 4. 예제 `tsconfig.json`
일반적인 타입스크립트 프로젝트에서 사용할 수 있는 `tsconfig.json` 예제입니다.

```json
{
  "compilerOptions": {
    "target": "ES6",
    "module": "CommonJS",
    "strict": true,
    "outDir": "./dist",
    "rootDir": "./src",
    "allowJs": true,
    "noImplicitAny": true,
    "strictNullChecks": true,
    "noUnusedLocals": true,
    "noUnusedParameters": true
  },
  "include": ["src"],
  "exclude": ["node_modules", "dist"]
}
```


타입스크립트 설정

tsconfig.json에 대하여

FrontEnd

TypeScript

타입스크립트 설정

김동환