타입스크립트 설치 및 초기세팅

1. 필요 패키지 설치

- npm 및 NodeJS (함께 설치됨)

: https://nodejs.org/en

 

 

 

2. 프로젝트 초기화

: 프로젝트 폴더에서 실행

# node 프로젝트 초기화
npm init

# 타입스크립트 설치
npm install typescript 

# ts-node 설치 (-D 옵션으로 프로젝트의 devDependencies에 추가)
# ts 파일을 js 파일로 컴파일하여 node에서 실행
npm install -D ts-node

# devDependencies
# 실제 코드에 포함되지 않으면서 개발 단계에만 필요한 의존성 파일(패키지)들

 

 

 

3. 타입스크립트 컴파일 세부 옵션 설정

# tsconfig.json 파일 생성
npx tsc --init

 

- tsconfig.json 예시

{
  "compilerOptions": {
     // 컴파일할 js 버전.
    "target": "es5",

    // 컴파일 할 때 포함될 라이브러리 목록
    "lib": [
      "dom",
      "dom.iterable",
      "esnext"
    ],

    // ts 파일을 컴파일 할 때 js 파일도 포함하는 여부. 
    // 기존 자바스크립트 프로젝트에서 타입스크립트 적용 시 유용
    "allowJs": true, 
    
    "skipLibCheck": true,
    "allowSyntheticDefaultImports": true,

    // 엄격한 타입 검사
    "strict": true,

    "forceConsistentCasingInFileNames": true,
    "noFallthroughCasesInSwitch": true,

    // js 파일간 import 시 사용하는 문법
    "module": "commonjs",

    // 컴파일 된 js가 생성되는 경로
    "outDir": "dist", 

    // 시작 경로
    "rootDir": "src", 
  },

  // ts 파일을 js로 컴파일할 폴더 지정
  "include": [
    "src/**/*"
  ],

  // js로의 컴파일에서 제외할 폴더 지정
  "exclude": [
    "node_modules"
  ]
 }

 

- 컴파일러 옵션

https://typescript-kr.github.io/pages/compiler-options.html

 

- tsconfig 설정

https://joshua1988.github.io/ts/config/tsconfig.html#%ED%83%80%EC%9E%85%EC%8A%A4%ED%81%AC%EB%A6%BD%ED%8A%B8-%EC%84%A4%EC%A0%95-%ED%8C%8C%EC%9D%BC-tsconfig-json

 

 

 

 

4. 테스트 

- app.ts 작성

function main() {
  console.log("테스트");
}

main();

 

- 컴파일

# 현재 디렉터리에서 ts 컴파일 실행
npx tsc

 

- 컴파일 후 생성된 js 파일 실행

node app.js

 

 

 

 

 

 

 

 

Reference

타입스크립트 기본 설치와 초기 세팅