[React] Vite 프로젝트 생성하고 실행하는 방법 총 정리

✅ 참고

아래 설명문은 React와 TypeScript를 사용하여 Vite 프로젝트를 생성하고 실행하는 방법입니다.

 

1. vite 설치

아래 명령어를 통하여 vite 프로젝트를 생성해 줍니다.

$ npm create vite

 

2. 프로젝트 폴더 이름 설정

프로젝트 폴더 이름을 입력하여 프로젝트의 폴더 이름을 설정해 줍니다.

 

3.  프레임워크 및 라이브러리 설정

위, 아래 키보드를 사용하여 프로젝트에서 사용할 프레임 워크 및 라이브러리를 설정해 줍니다.

 

4. 프로그래밍 언어 설정

위, 아래 키보드를 사용하여 프로젝트에서 사용할 프로그래밍 언어를 설정해 줍니다.

 

5. 프로젝트 생성 완료

프로젝트 생성이 완료되었습니다.

 

6. npm 설치

 

 

아래 명령어를 통하여 프로젝트 폴더로 이동 후 npm 설치를 진행해 줍니다.

# 프로젝트 폴더로 이동 명령어
$ cd vite-project

# npm 설치 명령어
$ npm i

정말 알기 쉽게 정리한 node란? npm이란?

Node.js와 NPM이란? 아주 쉽게 정리

 

7. vite 실행

해당 명령어를 통하여 vite 프로젝트를 실행시킨 후, 해당 링크로 접속해 줍니다.

$ npm run dev

 

8. 완료