목차

, , , ,

tsconfig.json 구성

tsconfig.json은 TypeScript 프로젝트의 입력 파일, compiler option, 상속, project reference를 선언하는 JSON configuration file이다.

Summary

Locations

일반적으로 프로젝트 루트에 둔다. 용도별 설정은 기본 설정을 상속하는 별도 파일로 나눈다.

project/
├── tsconfig.json
├── tsconfig.build.json
├── src/
└── tests/

Authoring

Initialize

현재 설치된 TypeScript 버전의 기본 설정 파일을 생성한다.

npx tsc --init

Basic Node.js project

runtime과 의존성 조건에 맞춰 target, module, moduleResolution 값을 조정한다.

{
  "compilerOptions": {
    "target": "ES2022",
    "module": "NodeNext",
    "moduleResolution": "NodeNext",
    "rootDir": "src",
    "outDir": "dist",
    "strict": true,
    "noEmitOnError": true,
    "forceConsistentCasingInFileNames": true,
    "skipLibCheck": true
  },
  "include": ["src/**/*.ts"],
  "exclude": ["node_modules", "dist"]
}

Fields

Input files

Output and language

Type checking

Extends

공통 설정을 기본 파일에 두고 환경별 파일에서 extends로 상속한다. 파생 설정에 같은 property가 있으면 상속된 값을 덮어쓴다. references는 상속되지 않으므로 필요한 설정마다 명시한다.

{
  "extends": "./tsconfig.json",
  "compilerOptions": {
    "declaration": true,
    "sourceMap": true
  },
  "exclude": ["tests", "dist"]
}
npx tsc --project tsconfig.build.json --showConfig

Project References

여러 package 또는 build 단위를 참조할 때 각 참조 대상에 composite를 활성화한다.

{
  "files": [],
  "references": [
    { "path": "./packages/core" },
    { "path": "./packages/cli" }
  ]
}

참조 대상의 설정 예:

{
  "compilerOptions": {
    "composite": true,
    "declaration": true,
    "rootDir": "src",
    "outDir": "dist"
  },
  "include": ["src/**/*.ts"]
}
npx tsc --build --verbose

Precedence

Validation

npx tsc --project ./tsconfig.json --showConfig
npx tsc --project ./tsconfig.json --listFilesOnly
npx tsc --project ./tsconfig.json --noEmit

CI에서는 project-local compiler와 lockfile을 사용한다.

{
  "scripts": {
    "typecheck": "tsc --noEmit",
    "build": "tsc --project tsconfig.build.json"
  }
}
npm run typecheck
npm run build

Troubleshooting

include matches no files

include pattern은 설정 파일 위치를 기준으로 해석한다. –showConfig–listFilesOnly로 경로와 최종 입력을 확인한다.

Module cannot be found

실제 runtime 또는 bundler에 맞는 modulemoduleResolution 조합인지 확인한다. –traceResolution으로 lookup 과정을 진단할 수 있다.

npx tsc --project tsconfig.json --traceResolution

Editor and CLI disagree

editor가 workspace의 project-local TypeScript SDK를 사용하는지, CLI가 같은 package manager와 작업 디렉터리에서 실행되는지 확인한다.

Compatibility

See Also

History