TypeScript :: 설치부터 JavaScript 변환까지

TypeScript 설치해서 JavaScript 로 변환해 실행시키는 과정입니다.
기본적으로 Node 설치가 되어 있어야 합니다.

Windows 10
Node.js v16.15.0

---

TypeScript 설치

$ npm install -g typescript

-g 옵션은 global 하게, 즉 전역에 설치를 하겠다는 의미이며 보통 개별 프로젝트에만 사용할 목적이 아니기 때문에 전역에 설치를 진행합니다.

• TypeScript 설치 & 버전 확인

$ tsc -v

이제 설치가 완료되었으니 타입스크립트 문법으로 작성을 해보고, 자바스크립트로 변환을 하겠습니다.

---

Transpiling (트랜스파일링)

• TypeScript 예제 코드 (tstest.ts)

enum Color1 {Red, Green, Blue};

tstest.ts 파일을 만들고 그 안에 위의 코드를 작성했습니다.

enum 타입은 타입스크립트에서만 사용하는 열거형 타입입니다.

• TypeScript to JavaScript / 자바스크립트로 변환

$ tsc tstest

tsc 컴파일러 사용 시 .ts 는 생략해도 됩니다.

var Color1;
(function (Color1) {
    Color1[Color1["Red"] = 0] = "Red";
    Color1[Color1["Green"] = 1] = "Green";
    Color1[Color1["Blue"] = 2] = "Blue";
})(Color1 || (Color1 = {}));
;

변환이 완료되면 tstest.js 파일이 생성될 것이고, 위의 코드처럼 열거형 타입을 js 버전으로 만들어주는 모습을 볼 수 있습니다.

변환 시 자바스크립트 버전 기본값은 ES3 입니다. 변환 시 원하는 버전으로 변경하도록 옵션을 줄 수도 있습니다.

$ tsc tstest -t es6

컴파일러 옵션은 아래 링크에서 자세하게 확인할 수 있습니다.

TypeScript: Documentation - tsc CLI Options (typescriptlang.org)

---

참고자료

• Angular Essentials / 저자: 이웅모