Web/TypeScript

[TS] 타입스크립트 환경 기본 설정

ansui 2024. 11. 5. 18:09

기본 설정

⚙ 실습 시작 전 기본 설정

1️⃣npm을 초기화하여 모두 기본으로 세팅한다. → package.json이 생성된다.

npm init

 

2️⃣types/node 설치

npm i @types/node

 

3️⃣컴파일러 옵션 설정 → tsconfig.json을 생성한다.

{
  "compilerOptions": {
    "target": "ESNext",
    "module": "ESNext",
    "outDir": "dist",
    "strict": true,
    "moduleDetection": "force"
  },
  "ts-node": {
    "esm": true
  },
  "include": ["src"]
}

 

"include": ["src"]

자동으로 배열안의 경로에 있는 모든 파일을 컴파일한다.

예) tsc를 터미널에 입력하면 src 디렉토리 안의 모든 파일을 컴파일 한다.

 

"target": "ES5"

옛날 버전으로 작성 - 화살표 함수가 없어서 함수표현식으로 바뀐다.

 

"target": "ESNext"

최신 버전으로 작성

 

"module": "CommonJS"

옛날 버전으로 모듈

 

"module": "ESNext"

최신 버전으로 모듈

 

"outDir": "dist"

컴파일 결과 자바스크립트 모듈들이 생성되는 디렉토리

 

"strict": true

엄격한 검사 모드 true / false

 

"moduleDetection": "force"

타입스크립트가 각각의 파일을 어떤 모듈로 감지할 것인지 설정

글로벌 모듈일 경우 같은 변수 사용 불가능 → 개별 모듈로 설정해야한다. (export, import 추가)

예) export를 자동으로 추가해준다.


이정환님의 인프런 강의 "한 입 크기로 잘라 먹는 타입스크립트(TypeScript)"를 참고하여 작성하였습니다.