TypeScript 사용을 위한 세팅(feat.니꼬쌤)

lano·2022년 5월 12일
0

typescript

목록 보기
1/4

0. TypeScript란?

  1. TypeScript는 오픈소스 언어로 마이크로소프트사에서 개발했다.

  2. JavaScript를 베이스로 정적 타입을 제공해준다. 컴파일 단계에서 에러를 확인할 수 있어서 안전하게 코드를 작성할 수 있다.

  3. TypeScript로 코드를 작성하면 TypeScript Compiler를 통해 JavaScript코드로 변환이 되어 사용이 된다. 그래서 웹 브라우저에서 코드가 작동이 가능하다.


1. TypeScript를 사용하는 환경

  1. Node.js는 JavaScript 코드를 웹 브라우저가 아닌 환경에서도 실행이 가능하게 해주는 실행기이다.

  2. Node.js 환경에서 npm을 통해 TypeScript관련 모듈을 설치하여 TypeScript를 사용할 수 있다.

2. TypeScript 사용을 위한 환경 만들기

  1. node.js프로젝트 생성

    npm init -y

  1. TypeScript모듈 설치

    npm i typescript --save-dev

  2. TypeScript 파일을 저장할 디렉토리 생성

  3. tsconfig.json file 생성후 작성

    {
      "include": ["src"],
      "compilerOptions" : {
        "outDir": "build",
        "target": "ES6",
        "lib": ["ES6", "DOM"]
      }
    }
    • include: typescript 파일 저장 위치를 알려준다.
    • compilerOptions
      • outDir: typescript 파일이 컴파일 결과인 javascript 파일을 저장할 디렉토리(디렉토리가 없으면 자동생성 된다.)
      • target: 어떤 버전의 javascript로 변환할 것인지에 대한 옵션
      • lib: 어떤 버전의 javascript가 어느 환경에서 작동할 것인지에 대한 옵션이다. (예를들어 DOM이라고 했을 경우 DOM에 관한 객체와 메서드를 사용할 수 있다.)

  4. package.json script추가

    "build": "tsc" 

    이렇게 되면 tsconfig.json파일에 설정 해둔 값에 의하여 npm run build 커맨드 입력시 자동으로 typescript 파일을 찾고 tsc에 의한 컴파일 결과물을 설정해둔 디렉토리에 저장을 해준다.

profile
시작.

0개의 댓글