[Typescript] Typescript 설치

1. 타입스크립트 설치 준비.

먼저 본인 개발환경에서 node.js가 설치되어 있어야 합니다. 

윈도우 환경에서는 https://nodejs.org/ko/ 를 통해서 LTS 최신버전을 받으시는 것을 추천드립니다.

Linux(ubuntu) 환경에서는 제가 전에 올린 포스팅 참조해서 설치하시면 됩니다.
2021.11.27 - [Node.js] - [Node.js] 우분투에 Node.js 설치

현재 22.02.25 기준으로 16.14.0 버전이 LTS최신이므로 해당 버전을 지정해서 받아주시는게 더 좋습니다.

 

설치가 되었다면 터미널을 열고 프로젝트를 진행할 폴더로 가서, 

sudo npm install -g typescript #전역설치

 

를 쳐주시면 됩니다.

해당 명령은 전역설치(모든 프로젝트에 적용될 수 있도록) 명령어이며, 혹 특정 프로젝트에만 적용시키고 싶다면 -g 옵션을 빼고 설치해 주시면 됩니다.

 

2. tsconfig.json 생성

Typescript 를 사용하기 위해서는 반드시 필요한 파일입니다. 

디렉토리에 tsconfig.json 파일이 있다면 해당 디렉토리가 TypeScript 프로젝트의 루트가 됩니다.
tsconfig.json 파일은 프로젝트를 컴파일하는 데 필요한 루트 파일과 컴파일러 옵션을 지정합니다. 

해당 파일을 프로젝트폴더 제일 상위에 위치해 주세요.

내용은 예제의 내용대로 입력해주시면 됩니다.  

{
    "compilerOptions": {
    	"target": "es6",
        "module": "commonjs",
        "noImplicitAny": true,
        "removeComments": true,
        "preserveConstEnums": true,
        "sourceMap": true
    },
}

디테일한 설명은 문서 링크로 남기겠습니다. (https://typescript-kr.github.io/pages/tsconfig.json.html)

간단히 설명하자면, tsc라는 명령은 typescript 파일은 직접 node 상에서 실행시킬 수 없습니다. 

.ts -> .js 파일로 변환하는 과정이 필요한데요 tsc 명령이 바로 그것입니다. 

별다른 추가 명령어 없이 tsc를 실행하면 컴파일러는 지금 작성한 tsconfig.json을 탐색하고, 파일을 읽어 해당 설정대로 실행합니다. 반대로 특정 파일을 지정하고 명령어를 실행하면 해당파일을 무시하고 실행하게됩니다.

 

3. 실제 테스트

let x :string = 3

console.log(x)

요런 코드를 index.ts 로 vscode 상에서 작성해보았습니다.

문법 관련해서는 따로 정리한 포스팅이 있으니 해당 포스팅을 통해 확인해주세요.

정상적으로 설치가 되었다면, 

해당 사진처럼 String으로 타입지정을 해 주었기 때문에 x 변수에 빨간줄이 그어져 있죠.

오류 내용까지 잘 나오는 모습을 보실 수 있습니다.

 

당연하게도 .ts파일은 node로 실행할 수 없습니다.

그렇기 때문에 $tsc index.ts를 실행해 주면  이를 변환한 index.js파일이 나오게 됩니다.

혹은 tsconfig.json을 만드셨다면 바로 $tsc를 실행시키셔도 무방합니다.