Vite

https://vitejs-kr.github.io/

비트

Esbuild를 기반으로 만들어진 프론트엔드 빌드툴

공식문서에 따르면 프랑스어로 '빠르다'를 의미하고, 빠르고 간결한 모던 웹 프로젝트 개발 경험에 초점을 맞춰 탄생한 빌드 도구이다.

개발 시 네이티브 ES Module을 넘어 더욱 다양한 기능을 제공한다. 번들링 시, Rollup 기반의 다양한 빌드 커맨드를 사용할 수 있습니다. 이는 높은 수준으로 최적화된 정적(static) 리소스들을 배포할 수 있게끔 하며, 미리 정의된 설정(Pre-configured)을 제공합니다.

번들의 역사와 Vite의 탄생

https://yozm.wishket.com/magazine/detail/1620/

CRA 대신 사용하는 이유

Webpack을 사용하는 CRA보다 Go(Low-Level Lang)로 작성된 JS빌드툴인 Esbuild를 사용하여 빌드 속도가 엄청나게 빠르다.

Vite가 빠른 이유

• 엄청 빠른 esbuild를 써서
• 라이브러리 설치하자마자 미리 bundle 만들어놓음
• 소스코드는 필요한 것만 건드림

지원하는 템플릿

• vanilla
• vue
• react
• preact
• lit
• svelte

시작하기

npm create vite@latest my-react-app --template react
또는
npm create vite@latest my-vue-app --template vue