Vite 6 완벽 가이드 — 환경 API와 Rolldown 통합으로 빌드 혁신

환경 API(Environment API)

Vite 6의 가장 큰 변화는 환경 API의 도입이다. 기존에는 클라이언트와 SSR 빌드를 별도의 Vite 프로세스로 실행하거나 복잡한 설정으로 통합해야 했다. 환경 API는 client, ssr, edge 등 여러 빌드 환경을 단일 Vite 인스턴스에서 통합 관리할 수 있게 한다. 각 환경은 독립적인 모듈 그래프, 플러그인 파이프라인, 설정을 가질 수 있어 SvelteKit, Nuxt, Remix 같은 메타 프레임워크가 복잡한 다중 환경 빌드를 구현하기 훨씬 쉬워진다.

// vite.config.ts — Vite 6 환경 API
import { defineConfig } from 'vite'

export default defineConfig({
  environments: {
    client: {
      build: { outDir: 'dist/client' }
    },
    ssr: {
      build: { outDir: 'dist/server', ssr: true }
    },
    edge: {
      build: { outDir: 'dist/edge', target: 'esnext' }
    }
  }
})

Rolldown 실험적 통합

Rolldown은 Rust로 작성된 고성능 JavaScript 번들러로, Vite 팀이 개발 중이며 장기적으로 esbuild와 Rollup을 대체할 예정이다. Vite 6에서는 vite-plugin-rolldown 플러그인으로 Rolldown을 실험적으로 활성화할 수 있다. 벤치마크에서 esbuild와 Rollup 조합 대비 2-5배 빠른 빌드 속도를 보이며, Rollup 플러그인 API와 높은 호환성을 목표로 한다. 2026년 현재 안정화 작업이 진행 중이며, Vite 7에서 기본 번들러로 채택될 예정이다.

주요 Breaking Changes

Vite 6에서 Node.js 18 미만 버전 지원이 중단되었으며, 일부 내부 API가 변경되었다. resolve.browserField 옵션이 기본적으로 비활성화되고, JavaScript 설정 파일의 타입 처리 방식이 변경되었다. 플러그인 개발자는 환경 API를 인식하도록 플러그인을 업데이트해야 하며, vite 패키지를 6.x로 업그레이드한 뒤 빌드 오류를 확인하는 과정이 필요하다. 대부분의 주요 플러그인은 이미 Vite 6 호환 버전을 출시하였다.

런타임 독립성 강화

Vite 6는 Node.js 외에 Deno, Bun, Cloudflare Workers 런타임을 더 잘 지원하도록 런타임 독립적인 API를 강화하였다. 개발 서버와 빌드 파이프라인에서 Node.js 특정 API 사용을 줄이고, 런타임 중립적인 추상화를 통해 다양한 환경에서 일관된 개발 경험을 제공한다. Bun과 함께 사용하면 의존성 설치 속도와 개발 서버 시작 시간이 모두 단축된다.

SvelteKit, Nuxt, Astro와의 통합

SvelteKit 2.x, Nuxt 3.x, Astro 5.x는 모두 Vite 6를 기본으로 사용하며, 환경 API를 적극 활용하도록 내부적으로 업데이트되었다. 이 프레임워크를 사용 중이라면 별도 설정 없이 Vite 6의 이점을 자동으로 누릴 수 있다. React 기반 프로젝트에서는 @vitejs/plugin-react나 @vitejs/plugin-react-swc의 최신 버전을 함께 업그레이드해야 한다.

개발 서버 성능 개선

Vite 6의 개발 서버는 모듈 그래프 업데이트 알고리즘이 개선되어 대형 프로젝트에서 HMR 속도가 향상되었다. 특히 수천 개의 모듈을 포함하는 모노레포에서 파일 변경 시 HMR 전파 시간이 줄었다. 환경별 모듈 그래프가 독립적으로 관리되어 클라이언트 파일 변경이 SSR 빌드에 불필요한 영향을 주지 않는다.