Typescript Installing & Setting

www.typescriptlang.org/#installation

Typed JavaScript at Any Scale.

npm 코드를 복사해, 터미널에

mac은 sudo를 앞에 붙여 설치를 진행.

 

그리고, vs cod에서 app.ts 파일을 만들어 간단한 코드를 작성해주었다. 

function logName (name: string){
    console.log (name);
}

logName('Jack');

 

그리고 하단 터미널에서, 다음의 코드를 입력해주면, 

tsc app.ts

타입스크립트 파일이 컴파일되어 자동으로 JS 코드로 변환해 JS파일을 생성해준다.

function logName(name) {
    console.log(name);
}
logName('Jack');

 

JS의 문법으로 컴파일 된 것을 볼 수 있다. 그 다음에 터미널에서 node app.js를 입력하면, 위의 함수가 실행되어 'Jack'이 출력되는 것을 확인할 수 있다.  html에 script 태그 달아서 연결 & 실행도 해본다. 

만약 typescript 파일에 버그가 생기면,  터미널에 다음과 같이 입력해준다. json 파일이 생성되며 버그가 사라짐. 

tsc --init

 

그런데 매번 수정할 때마다 컴파일을 해주는 것이 귀찮으므로, 

터미널에서 다음과 같이 명령한다.

tsc -w app.ts

w는 watch의 줄임말로, 변화를 감시해서 알아서 추적해달라는 뜻이다.

이렇게 작동하기 시작하고, 타입스크립트 파일의 변경사항이 실시간으로 js 파일로 컴파일되어 나타난다. 

 

 

 

 

참고 영상: 

www.youtube.com/watch?v=PTKsW6YtAYU