(TypeScript) - TypeScript 컴파일 후 실행해보기

TypeScript 활용해보기 위해서 새로운 프로젝트를 하나 생성해주고 세팅해준다. 

세팅은 아래와 같다.

 

- npm init : node.js 초기화 

※ 초기화 시 나오는 것은 모두 기본값 설정해주면 되므로 Enter로 빠르게 넘긴다.

 

 

- npm i @types/node : node.js 가 제공하는 내장 기능들에 대한 타입 정보를 가지고 있는 types/node 설치

 

설치가 완료되면 package.json 에 정상적으로 dependencies 에 들어간 것 확인이 가능하다.

 

- npm install typescript -g : 타입스크립트 컴파일러 설치

※ -g : 컴퓨터 전체에서 사용 가능

 

이렇게 초기 세팅이 끝난다.

 

tsc(타입스크립트 컴파일러)

ts(타입스크립트 확장자)

 

 

tsc src/index.ts(컴파일할 파일 이름) : index.ts 를 컴파일 하는 명령어

tsc 컴파일러로 컴파일할 파일 경로를 적어주면 된다. 

 

 

해당 명령어를 치면 다음과 같이 JavaScript 가 생성되는데,

이전 글에서 얘기했듯이 생성된 자바스크립트에는 타입에 대한 정보는 없다.

 

※ 참고 (이전글)

https://hjsong96.tistory.com/273

(TypeScript) - TypeScript 와 TypeScript 의 동작 원리

 

이렇게 생성된 자바스크립트 실행을 위해서는 아래 노드 실행 명령어를 치면 된다.

 

- node src/index.js : node로 자바스크립트 실행하기

 

그러면 우리가 코드에서 원했던 "hello TypeScript" 가 정상적으로 콘솔에 찍힌다.

그런데 이렇게 매번 컴파일 할 때마다 JavaScript 가 생기고, 그것을 또 다시 node 로 실행하기는 번거롭다. 

따라서 이를 해결해주는 것이 바로 아래 명령어이다.

 

- npm i -g tsx : 한 번에 타입스크립트 컴파일 후 실행할 수 있는 tsx 전역에 설치

※ npm i -g  ts-node(불가능) : 이전까지는 가능했으나, node-js의 버전 업데이트로 현재 불가능!

따라서 npm i -g tsx 대체되었으니 이걸로 사용!

 

tsx src/index.ts : tsx 를 통해 실행하기

 

이렇게 되면 javaScript 파일 생성 없이 한 번에 컴파일 후 실행까지 가능하다.