«   2024/09   »
1 2 3 4 5 6 7
8 9 10 11 12 13 14
15 16 17 18 19 20 21
22 23 24 25 26 27 28
29 30
Archives
Today
Total
Recent Posts
Recent Comments
관리 메뉴

뉴히의 개발 로그

react 프로젝트 생성 - vite 로 프로젝트 생성/실행 본문

React

react 프로젝트 생성 - vite 로 프로젝트 생성/실행

뉴히 2024. 3. 4. 18:05

npm create vite@latest

 

프로젝트의 이름이나 사용하려는 템플릿을 직접 지정할 수도 있다.

Vite + Vue 프로젝트를 만들고 싶다면 다음과 같이 입력

# npm 7+, '--'를 반드시 붙여주세요
npm create vite@latest my-vue-app -- --template vue

# yarn
yarn create vite my-vue-app --template vue

# pnpm
pnpm create vite my-vue-app --template vue

# bun
bun create vite my-vue-app --template vue

그 외 템플릿

vanilla, vanilla-ts, vue, vue-ts, react, react-ts, react-swc, react-swc-ts, preact, preact-ts, lit, lit-ts, svelte, svelte-ts, solid, solid-ts, qwik, qwik-ts

 

cd 해당 프로젝트

npm install
npm run dev

 

기본적으로 Vite에서 제공하는 npm 스크립트

{
  "scripts": {
    "dev": "vite", // 개발 서버를 실행합니다. (`vite dev` 또는 `vite serve`로도 시작이 가능합니다.)
    "build": "vite build", // 배포용 빌드 작업을 수행합니다.
    "preview": "vite preview" // 로컬에서 배포용 빌드에 대한 프리뷰 서버를 실행합니다.
  }
}

 

 

vite 가이드 https://ko.vitejs.dev/guide/