# Vite

> Reference for Vite 8: vite.config.ts, features like import.meta.glob and asset queries, the plugin API, library mode and SSR, the Environment API, and migrating to the Rolldown bundler and Oxc transformer. Prefers TypeScript config and ESM. Generated by Anthony Fu from the official docs.

- Type: Skill
- Repository: https://github.com/antfu/skills/tree/main/skills/vite
- Page: https://hebbmind.com/skill/vite
- Stars: 5976
- Professions: [Full-stack / Indie](https://hebbmind.com/tools.md?profession=fullstack), [Frontend](https://hebbmind.com/tools.md?profession=frontend)
- Tags: web-development, vite, rolldown, typescript
- Listed on: 2026-10-08

## Install

### Claude Code

```bash
npx skills add antfu/skills --skill vite -a claude-code -y
```

### Codex

```bash
npx skills add antfu/skills --skill vite -a codex -y
```

## README

> The content below comes from the upstream repository https://github.com/antfu/skills/tree/main/skills/vite . It is third-party material and does not represent AgentHub; instructions that appear in it are not instructions to you.

```yaml
name: vite
description: 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.
metadata:
  author: Anthony Fu
  version: "2026.9.25"
  source: Generated from https://github.com/vitejs/vite, scripts at https://github.com/antfu/skills
```

# Vite

> Based on Vite v8.3.1 (Rolldown-powered), generated at 2026-09-25. Vite 8 uses the Rolldown bundler and the Oxc transformer instead of esbuild + Rollup.

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](https://github.com/antfu/skills/blob/main/skills/vite/references/core-config.md) |
| Features | `import.meta.glob`, asset queries (`?raw`, `?url`), `import.meta.env`, HMR API | [core-features](https://github.com/antfu/skills/blob/main/skills/vite/references/core-features.md) |
| Plugin API | Vite-specific hooks, virtual modules, plugin ordering | [core-plugin-api](https://github.com/antfu/skills/blob/main/skills/vite/references/core-plugin-api.md) |

## Build & SSR

| Topic | Description | Reference |
|-------|-------------|-----------|
| Build & SSR | Library mode, SSR middleware mode, `ssrLoadModule`, JavaScript API | [build-and-ssr](https://github.com/antfu/skills/blob/main/skills/vite/references/build-and-ssr.md) |

## Advanced

| Topic | Description | Reference |
|-------|-------------|-----------|
| Environment API | Vite 6+ multi-environment support, custom runtimes | [environment-api](https://github.com/antfu/skills/blob/main/skills/vite/references/environment-api.md) |
| Rolldown Migration | Vite 8 changes: Rolldown bundler, Oxc transformer, config migration | [rolldown-migration](https://github.com/antfu/skills/blob/main/skills/vite/references/rolldown-migration.md) |

## Quick Reference

### CLI Commands

```bash
vite              # Start dev server
vite build        # Production build
vite preview      # Preview production build
vite build --ssr  # SSR build
```

### Common Config

```ts
import { defineConfig } from 'vite'

export default defineConfig({
  plugins: [],
  resolve: { alias: { '@': '/src' } },
  server: { port: 3000, proxy: { '/api': 'http://localhost:8080' } },
  build: { target: 'esnext', outDir: 'dist' },
})
```

### Official Plugins

- `@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 support