vite
Next-generation frontend build tool with native ESM dev server, HMR, and Rolldown-powered production builds.
- Fast development server using native ES modules and hot module replacement; production builds optimized with Rolldown bundler and Oxc transformer
- Configuration via
vite.config.tswith support for conditional configs, environment variables, and TypeScript; plugin API for extending build behavior - Built-in asset handling with import queries (
?raw,?url), glob imports, andimport.meta.envfor environment-based logic - Library mode and SSR support including middleware mode,
ssrLoadModule, and JavaScript API for programmatic builds - Official plugins available for Vue 3, React, JSX, and legacy browser support; Vite 8 migration guide for Rolldown adoption
Vite
Based on Vite 8 beta (Rolldown-powered). Vite 8 uses Rolldown bundler and Oxc transformer.
Vite is a next-generation frontend build tool with fast dev server (native ESM + HMR) and optimized production builds.
Preferences
- Use TypeScript: prefer
vite.config.ts - Always use ESM, avoid CommonJS
Core
| Topic | Description | Reference |
|---|---|---|
| Configuration | vite.config.ts, defineConfig, conditional configs, loadEnv |
core-config |
| Features | import.meta.glob, asset queries (?raw, ?url), import.meta.env, HMR API |
core-features |
| Plugin API | Vite-specific hooks, virtual modules, plugin ordering | core-plugin-api |
More from onmax/nuxt-skills
nuxt
Use when working on Nuxt 4+ projects - provides server routes, file-based routing, middleware patterns, Nuxt-specific composables, and configuration with latest docs. Covers h3 v1 helpers (validation, WebSocket, SSE) and nitropack v2 patterns. Updated for Nuxt 4.3+.
6.2Kreka-ui
Use when building with Reka UI (headless Vue components) - provides component API, accessibility patterns, composition (asChild), controlled/uncontrolled state, virtualization, and styling integration. Formerly Radix Vue.
6.1Kvue
Use when editing .vue files, creating Vue 3 components, writing composables, or testing Vue code - provides Composition API patterns, props/emits best practices, VueUse integration, and reactive destructuring guidance
5.9Knuxt-ui
Use when building styled UI with @nuxt/ui v4 components - create forms with validation, implement data tables with sorting, build modal dialogs and overlays, configure Tailwind Variants theming. Use vue skill for raw component patterns, reka-ui for headless primitives.
5.6Kvueuse
Use when working with VueUse composables - track mouse position with useMouse, manage localStorage with useStorage, detect network status with useNetwork, debounce values with refDebounced, and access browser APIs reactively. Check VueUse before writing custom composables - most patterns already implemented.
2.3Kvitest
Use when writing unit/integration tests for Vite projects - configure vitest.config.ts, write test suites with describe/it, create mock implementations with vi.fn and vi.mock, set up code coverage thresholds, and run tests in parallel
1.8K