[TypeScript] The tsconfig.json File

안녕하세요 동기 여러분! 오늘은 tsconfig.json 파일이 무엇인지 알아봅시다!

 

제 포스팅 내용은 Codecademy에서 배운 내용을 토대로 작성되고 있습니다.
링크 : https://www.codecademy.com/

Learn to Code - for Free | Codecademy

 

The tsconfig.json File

타입스크립트의 기능들은 상당히 유용한데요, 자바스크립트 코드에 타입들도 추가해주고 실행 전에 신텍스(syntax) 에러도 있는지 없는지 확인해줍니다. 거기다가 왜 에러가 났는지, 어떤 코드를 써야 하는지 추천도 해줍니다. 타입스크립트는 아주 융통성이 뛰어난 친구죠.

 

하지만 우리가 이런 타입스크립트의 도움이 불편할 때가 있습니다. 이런 상황인 경우 우리가 눈여겨봐야 하는 파일이 tsconfig.json입니다. 

 

---

Sample tsconfig.json and Breakdown

tsconfig.json 파일은 항상 우리가 만든 프로젝트 -> 루트 디렉토리에 위치합니다. tsconfig.json 파일은 우리가 컴파일링 설정을 마음대로 바꿀 수 있기 때문에 아주 유용한 파일입니다.

 

아래의 json 코드를 보도록 하겠습니다.

{
  "compilerOptions" : {
    "target": "es2017",
    "module": "commomjs",
    "strictNullChecks": true
  },
  "include": ["**/*.ts"]
}

• "compilerOptions"는 타입스크립트의 컴파일링 규칙을 담고 있는 중첩 객체입니다.
• "target"과 그의 값인 "es2017"은 "프로젝트가 2017 version of EcmaScript standards를 자바스크립트를 위해 사용될 것이야."라는 뜻을 가집니다.
• "module"과 그의 값인 "commonjs"는 프로젝트가 commonjs 신텍스를 사용해 모듈을 받아들이고 내보낼 것임을 나타냅니다.
• "strictNullChecks"는 만약에 변수들이 명확하게 눌(null)이나 언디파인드(undefined) 타입으로 선언이 된다면 변수들은 오직 눌과 언티파인드 값만 가져야 한다는 것을 나타냅니다. 
• "include"는 어떤 파일들이 컴파일링 규칙에 적용되어야 하는지 정의합니다. 위 코드의 경우, ["**/*.ts]는 컴파일러가 모든 '.ts'라는 확장자를 가진 파일들은 확인해 봐야 한다는 것을 의미합니다.

이러한 규칙들은 tsconfig.json 파일을 통해 수정이 가능하며 개인 프로젝트이든 팀 프로젝트이든 어떻게 코드를 작성해야할지 방향을 제시해주기 때문에 상당히 좋습니다. (영문 버전을 보면 진짜 'The tsconfig.json file is great'이라고 적혀 있네욬ㅋㅋㅋ)

 

---

Usage

tsconfig.json 파일과 함께라면 tsc 명령어를 사용하면 컴파일러가 자동적으로 우리의 tsconfig.json 파일을 인식해서 어떤 특정한 파일에 적용해야할지 알아차립니다. 아니면 tsc 파일명.ts 명령어로도 컴파일링을 할 수 있습니다.

 

 

---

 

오늘의 느낌

한마디로 정리하면 tsconfig.json 파일을 토대로 지난 시간까지 알아본 에러 문구들(컴파일링 할 때 뜬 에러들)이 다 들어있다는 소리!

이게 수정, 삭제, 추가가 가능해서 아주 유용하다. 끝

 

configure 컴퓨터의 환경을 설정하다

configuration 배열, 배치, 환경 설정