
Vite란?
- 비트는 자바스크립트 네이티브 모듈을 기반으로 한 데브 서버
- 웹팩을 사용할 때보다 훨씬 빠르게 개발하고 배포할 수 있다.
번들링
- 모듈화 문법을 이용하여 여러개의 파일을 하나로 합쳐주거나 의미있는 단위로 묶어주는 것
- 현재 프런트엔드 개발 생태계는 모듈 번들러로 대부분 웹팩 사용
ESM(자바스크립트 네이티브 모듈)
- 모듈화문법인
import
, export
를 별도의 도구 없이 브라우저 자체에서 소화해낼 수 있는 모듈 방식
Vite 특징
- 로컬에서 개발할 때 번들링을 하지 않고 ESM 방식을 사용하여 로컬 서버 구동 속도가 매우 빠르다.
- 번들링을 하지 않고 바로 서버를 실행하기 때문에 명령어를 실행함과 동시에 서버가 바로 구동된다.
사용법
npm create vite@latest
: vite 설치
npm create vite@latest {프로젝트명} -- --template {템플릿명}
: 템플릿으로 프로젝트 시작
- 프로젝트 폴더로 이동 후
npm run dev
: 프로젝트 실행
이번 프로젝트에서 react-ts
를 이용해 작업하기로 하였다.