본문 바로가기

JS/TypeScript

타입스크립트 튜토리얼 환경 설정

타입스크립트 온라인 환경 https://www.typescriptlang.org/play/

타입스크립트를 작성하고 run하면 컴파일러가 생성한 자바스크립트를 보여준다.


이러한 타입스크립트 코드는

var num:number = 12 
console.log(num)

이런 자바스크립트 코드로 컴파일된다.

var num = 12;
console.log(num);


타입스크립트는 오픈 소스 기술이다. 모든 브라우저, 호스트, OS 상에서 동작한다. 타입스크립트 프로그램을 작성하고 테스트하기 위해 다음과 같은 도구가 필요하다.


텍스트 에디터

Notepad, Notepad++, Emacs, vim or vi 등이 있다. OS에 따라 편집기가 다를 수 있다.


타입스크립트 컴파일러

타입스크립트 컴파일러 자체는 자바스크립트 파일로 컴파일된 .ts 파일이다. TSC(TypeScript Compiler)는 소스 대 소스 컴파일러(transcompiler/transpiler)이다.


app.ts를 TSC가 컴파일하면 app.js가 된다... 이러한 처리를 transpilation이라고 부른다. 그러나 컴파일러는 순수 자바스크립트 파일이 지나가는 것을 거부한다. 컴파일러는 오직 .ts 또는 .d.ts 파일만 다룬다.


Node.js 설치

윈도우 환경

https://nodejs.org/en/download


.msi 인스톨러를 다운받고 실행한다.

커맨드 창(윈도우 키 누르고 cmd 입력)에서 node -v를 치고 버전을 확인한다.

커맨드 창에서 npm install -g typescript를 입력한다.


통합 개발 환경 IDE 지원

비주얼 스튜디오 코드, 서브라임 텍스트2, 웹스톰, 이클립스, 브라켓츠 등에서 쓸 수 있다.

Download Visual Studio Code



 http://brackets.io/


브라켓츠는 확장 매니저를 통해 추가적인 기능을 추가할 수 있는 확장을 지원한다.

Extension Manager저 블록처럼 생긴 걸 누르고 typescript를 검색한다. Brackets TSLint와 Brackets Typescript를 설치한다.


https://www.tutorialspoint.com/typescript/typescript_environment_setup.htm