# Typescript 설치 및 세팅 방법 개요
- 타입스트립트는 node.js 관점에서는 npm module 중 하나일 뿐이다.
- 따라서 `npm` 으로 typescript 모듈을 설치하고, `tsc` 명령어로 ts파일을 js파일로 컴파일하면 된다.
# 설치 및 세팅 방법
1. node.js 설치 (3가지 방법이 있음)
- 방법1(초보자 추천): node.js 홈페이지를 통해 설치한다.
- 방법2: n 으로 설치(버전 업그레이드에 용이)
- 방법3: nvm (버전 스위칭에 용이)
2. package.json 파일 생성 (프로젝트 루트 경로 터미널에서)
- `npm init -y` : 디폴트 세팅으로 package.json파일을 생성해준다. (나중에 수정 가능)
3. typescript 모듈 설치 (루트 경로 터미널에서)
- `npm install typescript` : 현재 프로젝트에 typescript 라이브러리를 설치한다.
- `npm install typescript -g` : 전역에 설치한다(어디서나 typescript 컴파일이 가능)
4. tsconfig.json 파일 생성 (루트 경로 터미널에서)
- `tsc --init` : tsconfig.json 파일이 생성된다(global로 설치 안 한경우, `npx tsc --init`)
- 타입스크립트 컴파일 환경을 세팅한다. (기본적인 설정만 했음)
{
"compilerOptions": {
"target": "es5",
"module": "commonjs",
"outDir": "dist",
"skipLibCheck": true,
"strict": true
},
"include": ["src/**/*.ts"],
"exclude": ["node_modules"]
}
- target(타겟 JS 버전), module(모듈 방식), outDir(JS 파일로 컴파일한 결과물들이 위치할 경로), include(TS파일이 위치한 곳)
- 추가 상세 옵션은 https://www.typescriptlang.org/tsconfig 참고
5. ts 파일 생성 (src 경로에서)
- 타입스크립트로 코딩을 해준다.
const num1: number = 1;
6. ts파일을 js 자바스크립트로 컴파일한다. (루트 경로 터미널에서)
- (로컬 설치한 경우) `npx tsc`
- (글로벌 설치한 경우)`tsc`
7. 컴파일한 결과물(JS파일)은 dist 경로에서 확인할 수 있다.
"use strict";
var num1 = 1;
E.O.D
'개발(Development) > JS(자바스크립트)' 카테고리의 다른 글
[JS] Shallow Copy & Deep Copy 기본 개념, 원리 (feat. 값 vs. 레퍼런스 전달) (0) | 2023.08.22 |
---|---|
[Typescript] @ts-ignore vs. @ts-expect-error 차이, 사용법(타입 에러 무시) (0) | 2023.05.09 |
[JavaScript] if 조건문 효율적으로 가독성 있게 쓰는 방법 (0) | 2023.05.07 |
[JS]requestAnimationFrame/cancelAnimationFrame원리와 사용 방법(Feat. 브라우저 작동 방식) (0) | 2023.01.21 |
[Puppeteer] M1 맥북 Chromium Error: Failed to launch the browser process 해결 방법 (0) | 2022.08.25 |
댓글