Vite

Vite는 한마디로 엄청나게 빠른 차세대 프론트엔드 빌드 도구 입니다. Vite가 빠른데에는 다음과 같은 이유가 있습니다.

  • Native ESM 이용 : 브라우저가 직접 모듈을 요청하게 함. 서버는 전체를 빌드하지 않고, 브라우저가 요청하는 파일만 즉시 넘김
  • Esbuild 활용 : 내부적으로 Go언어로 작성된 초고속 빌드 엔진인 Esbuild를 사용하여 의존성 라이브러리를 미리 빌드 함. 이게 Js 보다 수십 배 빠름

React와 마찬가지로 Vue도 Vite로 프로젝트를 생성하는것을 권장합니다.

프로젝트 생성하기

Vite 를 사용하려면 당연하게도 Node Js 설치가 필수입니다. (18+ 이상의 버전)

npm으로 빌드하기

npm create vue@latest

위 명령어를 치면, 프로젝트의 이름을 작성하는 창이 뜹니다.

여기에 프로젝트 이름을 입력해주면 됩니다.

그 아래에, typescript를 쓸지, vue에서 많이 사용하는 라이브러리들을 사용할지 물어보는 창이 나옵니다. 나중에 프로젝트에서 의존성을 추가하면 되므로, enter만 치고 넘깁니다.

이렇게하면, 프로젝트가 하나 만들어집니다.

아직, 의존성에 대한 모듈들이 설치되지 않은 상태이므로, 프로젝트 폴더의 경로로 접근하여 모듈들을 설치합니다.

cd test
npm install

이렇게하면, test 프로젝트에 필요한 모듈들이 다 뜹니다.

마지막으로, 프로젝트를 시작하려면

npm run dev

그리고, 프로젝트를 빌드하려면

npm run build

를 사용하면 됩니다.