1. Typescript Basic(with 노마드코더)

Dev Cho·2020년 5월 14일
0

아래의 영상을 보고 개인적으로 정리한 글입니다
링크 : 노마드 코더의 타입스크립트 강의

Typescript란?

  • Superset of Javascript
  • Typescript 는 JS 로 컴파일 됨.

Typescript 를 왜 사용할까?

  • 엄격한 규칙이 존재함(타입을 가지고 있다!)
  • 예측 가능하고 읽기 쉬운 코드로 만들어 줌
  • 버그를 줄일 수 있으므로 서비스의 안정성이 증가함!

tsconfig.json 의 역할은?

  • Typescript 를 어떻게 Javascript 로 컴파일 할 것인지 명시
//tsconfig.json
{
  "compilerOptions": {
    "module": "commonjs", // nodejs 를 사용하고 import 및 export 가능하게 만든다.
    "target": "ES2015", // 어떤 버전의 JavaScript 로 컴파일 되고 싶은지?
    "sourceMap": true // 소스맵 생성 여부
  },
  "include": [
    "index.ts"
  ], // 컴파일 과정에 포함할 파일 명시.
  "exclude": [
    "node_modules" // 컴파일 과정에 제외할 파일 명시.
  ]
}
//index.ts
console.log('Hello Typescript');

위와 같이 간단한 tsconfig.json 그리고 index.ts 를 작성 후
터미널을 사용해 tsc 를 입력하면 index.js 그리고 index.js.map 이 생성된다.(tsc 명령어를 입력하기 전에 yarn 또는 npm 을 통해 typescript 가 설치되어 있어야 한다.)

tsc 명령어는 내가 tsconfig.json 에 명시한 파일들을 컴파일 후 생성해 주는 것을 알 수 있다.

tsc 명령어를 통해 index.ts 파일이 index.js 로 컴파일이 된 것을 확인했으면 한 번 실행시켜보자.

// package.json
  "scripts": {
    "start": "node index.js",
    "prestart": "tsc"    
  },

package.json 스크립트에 위와 같이 추가한 후 yarn start 또는 npm start 를 입력하면 컴파일 된 파일이 실행되고 Hello Typescript 가 올바르게 출력되는 것을 볼 수 있다.

Node.js 는 TypesScript 를 이해하지 못하므로 .ts 파일을 .js 로 컴파일 후 실행시켜야 함

간단하게 TypeScript 를 설정 하고 컴파일 해보았으며 실행도 시켜보았다. 앞으로는 본격적으로 TypeScript 를 사용해보며 익혀보자.

0개의 댓글