이 글은 타입스크립트 입문 - 기초부터 실전까지의 타입스크립트 시작하기 부분을 보고 정리한 글입니다.
index.ts
생성
다음과 같은 코드 작성
const sum = (a: number, b: number): number => {
return a + b;
};
sum(10, 20);
그러나 이 파일을 바로 브라우저가 인식을하지 못하기 때문에 ts파일을 js파일로 컴파일하는 과정이 필요함
터미널을 열고 node가 설치되어 있는 상태에서 타입스크립트를 글로벌 환경으로 설치해줌
npm i typescript -g
위 명령어로 설치 후, tsc명령어로 ts파일을 컴파일 할 수 있음
tsc index.ts
index.js
var sum = function (a, b) {
return a + b;
};
sum(10, 20);
tsc와 같은 명령어로 컴파일을 할 시, 부가적인 옵션을 넣기 위해 tsconfig.json
을 사용할 수 있음
{
"compilerOptions": {
"allowJs": true, // 이 프로젝트 안의 js를 허용
"checkJs": true, // ts-check와 같은 역할(js에서 타입체크)
"noImplicitAny": true // 모든 타입에 대해서 적어도 any라는 타입을 적어야함
}
}
참고: https://www.typescriptlang.org/tsconfig
타입스크립트 코드 작성 시 변환된 코드를 확인할 수 있는 곳 (TS => JS)
tsconfig로 target 옵션을 이용하여 자신이 원하는 JS 버전으로 맞출 수 있음
바벨 또한 자신의 코드가 변환된 결과를 확인할 수 있는 사이트가 존재함 (JS 최신문법 => JS 낮은 버전의 문법으로 변환(모든 브라우저에서도 동일하게 코드가 작동되도록))