[ TypeScript ] React + Vite 로 시작하는 TypeScript

 

이제 타입 스크립트를 배우게 되어 타입 스크립트 사용을 위한 패키지를 설치해야 하는데

나는 CRA (create-react-app) 방식이 아닌, vite를 사용한 react+ts 방법을 사용했다.

vite의 자세한 설치 방법과 장점은 아래 글에서 확인할 수 있다.

https://gggimmin-development-technology.tistory.com/39

[ React ] 빠른 Frontend 개발을 위한 툴, Vite !

 

1. 터미널에서 아래 문구 입력

$ yarn create vite

 

2. 아래와 같은 문구가 뜬다면 vite-project 위치에 프로젝트 이름 짓기

? Project name: » vite-project

 

3. 아래 리스트에서 사용하는 프레임워크 선택

? Select a framework: » - Use arrow-keys. Return to submit.
>   Vanilla
    Vue
    React
    Preact
    Lit
    Svelte
    Solid
    Qwik
    Others

 

4. 자바 스크립트, 타입 스크립트 중 사용할 언어 선택 ( 타입스크립트 사용예정이니 타입스크립트 선택 )

- SWC 옵션은 컴파일 속도를 빠르게 해주는 것으로 알고있다

? Select a variant: » - Use arrow-keys. Return to submit.
>   TypeScript
    TypeScript + SWC
    JavaScript
    JavaScript + SWC
    Remix ↗

 

5. vite 을 이용한 타입스크립트 프로젝트 생성을 완료하였다 !

tsconfig.json 이 보인다면 성공 !