[TS] outDir & rootDir

TS 프로젝트를 빌드하면, 프로젝트 내의 .ts 파일들에 대해 각각 .js 파일들이 생성됩니다.

파일의 수가 적다면 문제되지 않지만, 파일의 수가 많아지면 파일들을 한눈에 보기 어려워집니다.

 

main1.ts와 main2.ts에 대해 각각 js 파일이 생성되었습니다.

빌드된 JS 파일들의 생성 위치를 미리 정해두면 간단하게 정리할 수 있는데,

이 때 수정해야 하는 파일이 tsconfig.json입니다.

outDir

outDir는 빌드된 파일이 생성되는 위치를 지정합니다.

". / "는 현재 ts파일과 같은 위치를 나타냅니다. 때문에 기본값으로 ts파일과 같은 위치에 js파일이 생성됩니다.

만약 outDir를 ". / dist" 로 설정하면, 모든 js파일들이 dist라는 폴더 안에 생성됩니다.

 

※ 사용할 때는 주석 처리를 해제해야 합니다!

rootDir

rootDir는 빌드될 파일 범위의 기준이 되는 root 경로를 지정합니다.

 

TS 프로젝트가 아래와 같은 구조로 되어 있을 때를 예로 들어봅시다.

root = ". / " 라면, 프로젝트 전체가 범위에 속하게 됩니다.

root = ". / folder" 라면, main3.ts만 범위에 속하게 됩니다.

따라서 outDir = ". / dist"로 설정하고, rootDir = " . / "로 설정한다면

빌드시 dist 폴더에는 폴더구조를 포함한 모든 js파일들이 생성됩니다.

만약 outDir = ". / dist"로 설정하고, rootDir = " . / folder"로 설정한다면

빌드시 dist 폴더에는 main3.js만 생성됩니다.

참고로 rootDir를 ". /"으로 하지 않으면 tsconfig.json에서 에러가 표시될 수도 있는데, 이는 rootDir에 포함되지 않는 파일이 나오게 되기 때문입니다. 실제로 사용하는데 문제가 되지는 않습니다.

※ 사용할 때는 주석 처리를 해제해야 합니다!