.agents/skills/vite/SKILL.md
Vite build tool configuration, plugin API, SSR, and Vite 8 Rolldown migration. Use when working with Vite projects, vite.config.ts, Vite plugins, or building libraries/SSR apps with Vite.
npx skillsauth add abeldotam/bmad-viewer viteInstall this skill globally with one command. Works with Claude Code, Cursor, and Windsurf.
4 of 9 scanners reported clean
Some scanners were skipped, did not run, or reported a non-clean status. Review each row below.
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.
vite.config.ts| 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 |
| Topic | Description | Reference |
|-------|-------------|-----------|
| Build & SSR | Library mode, SSR middleware mode, ssrLoadModule, JavaScript API | build-and-ssr |
| Topic | Description | Reference | |-------|-------------|-----------| | Environment API | Vite 6+ multi-environment support, custom runtimes | environment-api | | Rolldown Migration | Vite 8 changes: Rolldown bundler, Oxc transformer, config migration | rolldown-migration |
vite # Start dev server
vite build # Production build
vite preview # Preview production build
vite build --ssr # SSR build
import { defineConfig } from 'vite'
export default defineConfig({
plugins: [],
resolve: { alias: { '@': '/src' } },
server: { port: 3000, proxy: { '/api': 'http://localhost:8080' } },
build: { target: 'esnext', outDir: 'dist' },
})
@vitejs/plugin-vue - Vue 3 SFC support@vitejs/plugin-vue-jsx - Vue 3 JSX@vitejs/plugin-react - React with Oxc/Babel@vitejs/plugin-react-swc - React with SWC@vitejs/plugin-legacy - Legacy browser supporttools
Toolkit for interacting with and testing local web applications using Playwright. Supports verifying frontend functionality, debugging UI behavior, capturing browser screenshots, and viewing browser logs.
development
Apply VueUse composables where appropriate to build concise, maintainable Vue.js / Nuxt features.
development
Vue 3 Composition API, script setup macros, reactivity system, and built-in components. Use when writing Vue SFCs, defineProps/defineEmits/defineModel, watchers, or using Transition/Teleport/Suspense/KeepAlive.
development
Vue 3 debugging and error handling for runtime errors, warnings, async failures, and SSR/hydration issues. Use when diagnosing or fixing Vue issues.