꾸준히 성장하는 개발자

[React] vite 사용해보기 본문

React

[React] vite 사용해보기

ahleum 2022. 6. 13. 05:17

https://vitejs.dev/guide/

 

Getting Started | Vite

Getting Started Overview Vite (French word for "quick", pronounced /vit/, like "veet") is a build tool that aims to provide a faster and leaner development experience for modern web projects. It consists of two major parts: Vite is opinionated and comes wi

vitejs.dev

 

 

npm create vite@latest

터미널을 열고 위처럼 작성해주면 

프로젝트의 이름을 무엇으로 할 건지 정하라고 나온다

그럼 프로젝트의 이름을 작성해주면 된다. 따로 적지 않으면 위에 있는

vite-project로 지어지게 된다.

위 상태에서 엔터를 치고 내려오면 어떤 framework를 사용할지 물어본다. 

난 react를 사용할 거니까 react를 선택 

그럼 아래처럼 나오는데 react를 할 때 typescript를 함께 할지에 관한 여부를 고르라고 나온다

선택을 하면 설치는 완료가 된다. 

 

그럼 실행을 할 때는 이렇게 하라고 친절히 설명도 해준다.

 

폴더를 이동후 

npm i 해주고 실행해주면 된다고 나온다. 

cd vite-project
  npm install    
  npm run dev

npm run dev까지 입력하고

 

잘 실행이 되는 것을 볼 수 있다.

여기서 다른 점은 

위에 탭 부분이 다른 점, 실행시간이 매우 빠른 점을 볼 수 있다.