빌드 / 최적화

Vite

Vite는 빠른 개발 서버와 프로덕션 빌드를 제공하는 현대적인 프론트엔드 빌드 도구입니다.

쉬운 설명

빠른 개발 서버와 빌드를 제공하는 현대적인 프론트엔드 빌드 도구.

배경과 쓰임까지 이해하기

조금 더 자세히

Vite는 빠른 개발 서버와 프로덕션 빌드를 제공하는 현대적인 프론트엔드 빌드 도구입니다.

React, Vue, Svelte, Astro 같은 프로젝트에서 개발 서버를 빠르게 띄우고 배포용 빌드를 만들 때 자주 사용합니다.

Vite는 개발 중에는 빠른 모듈 로딩을 제공하고, 배포 빌드에서는 번들러를 사용해 최적화된 결과물을 만듭니다.

실제로는 이렇게 만나요

Vite은(는) 실제 작업 흐름에서 Bundler, Bundling, React 같은 개념과 함께 등장합니다.

  • 이런 거 할 때 나와요 React, Vue, Svelte, Astro 같은 프로젝트에서 개발 서버를 빠르게 띄우고 배포용 빌드를 만들 때 자주 사용합니다.
  • 이렇게 생겼어요 Vite은(는) Bundler, Bundling, React 같은 주변 개념과 함께 문서, 설정 화면, 오류 메시지에서 자주 보입니다.
  • 나오는 화면 예시 빌드 / 최적화 작업을 하다가 Bundler, Bundling, React를 확인하는 화면

헷갈리기 쉬운 점

Vite는 개발 중에는 빠른 모듈 로딩을 제공하고, 배포 빌드에서는 번들러를 사용해 최적화된 결과물을 만듭니다.

왜 알아두면 좋을까요?

React, Vue, Svelte, Astro 같은 프로젝트에서 개발 서버를 빠르게 띄우고 배포용 빌드를 만들 때 자주 사용합니다.

Checklist

실제로 볼 때 확인할 것

  1. 01

    정의보다 쓰이는 상황을 먼저 본다

  2. 02

    관련 개념을 함께 확인한다

  3. 03

    실제 프로젝트에서 등장한 위치를 기록한다

관계 지도

Vite 중심으로 관련 개념의 정의와 관계를 한눈에 정리했습니다.
Vite의 정의와 관련 개념 간 관계를 설명한 계층형 그래프