`tsconfig.json` 깊이 읽기: 옵션보다 경계부터

"tsconfig 옵션은 백 개가 넘지만 대부분의 프로젝트에서 중요한 것은 열 개 남짓이야."

가장 중요한 옵션

target: 출력 JavaScript 수준. 현대 기본값은 ES2022이며 실제 런타임에 맞춰.
module: Node ESM에는 NodeNext, 번들러에는 ESNext, CommonJS는 레거시에 써.
moduleResolution: 현대 Node에는 NodeNext, Vite·esbuild에는 Bundler를 써.
strict: 항상 true로 두는 안전 메타 플래그야.
esModuleInterop: CommonJS 상호 운용을 위해 true로 둬.
skipLibCheck: 대부분의 앱에서 선언 파일 검사를 생략해 속도를 높여.
forceConsistentCasingInFileNames: 파일 이름 대소문자 불일치를 잡도록 true로 둬.
outDir와 rootDir: 출력과 소스 루트를 짝지어.
include와 exclude: 프로젝트 파일 범위를 정해.

tsconfig 베이스

npm의 @tsconfig/* 패키지는 환경별로 검증된 기본값을 제공해. extends: "@tsconfig/node20"처럼 시작하고 프로젝트에 필요한 차이만 덮어써. 더 엄격한 새 프로젝트는 @tsconfig/strictest도 선택할 수 있어.

검증된 베이스에서 시작하고 꼭 필요한 항목만 덮어써. 새 설정의 모든 옵션을 손으로 다시 고르는 대신 런타임과 엄격성에 맞는 기본값을 활용해.

Code

2 tsconfig — 명시와 상속·json

// tsconfig.json — Node ESM 프로젝트용 sensible 2026 default.
{
  "compilerOptions": {
    "target": "ES2022",
    "module": "NodeNext",
    "moduleResolution": "NodeNext",
    "strict": true,
    "esModuleInterop": true,
    "skipLibCheck": true,
    "forceConsistentCasingInFileNames": true,

    "verbatimModuleSyntax": true,
    "noUncheckedIndexedAccess": true,

    "outDir": "./dist",
    "rootDir": "./src"
  },
  "include": ["src/**/*"],
  "exclude": ["node_modules", "dist"]
}

// Base 확장:
{
  "extends": "@tsconfig/node20/tsconfig.json",
  "compilerOptions": {
    "outDir": "./dist"
  },
  "include": ["src/**/*"]
}

Exercise

새 프로젝트의 tsconfig에서 extends: '@tsconfig/node20'을 사용하도록 바꾸고 tsc --noEmit을 실행해. 오류가 생기면 어떤 엄격성 설정이 이전 구성에 숨어 있던 문제를 드러냈는지 추적해.

Hint

모두 통과한다면 이미 엄격한 설정에 가까운 거야. 오류가 나타나면 베이스가 이전 설정이 놓친 안전성 빈틈을 드러낸 것이니 어떤 옵션에서 시작됐는지 확인해.

가장 중요한 옵션

tsconfig 베이스

Code

External links

Exercise

Progress

댓글 0