프로젝트/트위터 클론코딩 JJack
[React] CRA 대신 Vite 사용해서 프로젝트 만들기
딜레이레이
2023. 11. 2. 22:29
CRA의 대체로 나온 Vite를 사용해볼 것이다. Vite는 CRA보다 속도가 빠르고 메모리를 적게 잡아먹는다는 장점이 있다고 한다.
프로젝트 만들기
npm create vite@latest
위 명령어를 입력하면 프로젝트를 만들 수 있는데 설정해주어야 할 것이 몇 개 있다.
Project name
- 따로 설정해주지 않으면 vite-project로 생성된다.
Select a framework
- 방향키를 이용하여 아래의 목록 중에 원하는 프레임워크를 선택하면 된다.
Select a variant
- 자바스크립트/타입스크립트 중에 선택할 수 있고 SWC를 사용할건지 선택할 수 있다. SWC에 대한 설명은 여기로
리액트 프로젝트 실행
vite-project 폴더로 이동해서 필요한 패키지를 설치하고 실행시켜보자.
cd vite-project
npm install
npm run dev
Vite는 CRA와는 달리 5173 포트를 사용한다.
리액트 로고가 빙글빙글 돌아가며 잘 실행되는 것을 확인할 수 있다.
[참고]