gt-agent-company/.agents/skills/vite/references/core-plugins.md

name, description

name	description
core-plugins	Adding, configuring, and ordering Vite plugins

Using Plugins

Vite extends Rolldown's plugin interface with extra Vite-specific options.

Adding Plugins

Install and add to config:

npm add -D @vitejs/plugin-vue

// vite.config.ts
import vue from '@vitejs/plugin-vue'
import { defineConfig } from 'vite'

export default defineConfig({
  plugins: [vue()]
})

Plugin Arrays

Plugins can return arrays (for complex features):

// Framework plugin returning multiple plugins
export default function framework(config) {
  return [
    frameworkRefresh(config),
    frameworkDevtools(config)
  ]
}

Conditional Plugins

Falsy values are ignored:

export default defineConfig({
  plugins: [
    vue(),
    process.env.ANALYZE && visualizer()  // Only if ANALYZE is set
  ]
})

Enforcing Plugin Order

Control when plugin runs relative to Vite core:

export default defineConfig({
  plugins: [
    {
      ...somePlugin(),
      enforce: 'pre'  // Before Vite core plugins
    },
    {
      ...anotherPlugin(),
      enforce: 'post'  // After Vite build plugins
    }
  ]
})

Order:

1. Alias
2. Plugins with enforce: 'pre'
3. Vite core plugins
4. Plugins without enforce
5. Vite build plugins
6. Plugins with enforce: 'post'
7. Vite post-build plugins (minify, manifest)

Conditional Application

Apply only during serve or build:

export default defineConfig({
  plugins: [
    {
      ...typescript2(),
      apply: 'build'  // Only during build
    },
    {
      ...devOnlyPlugin(),
      apply: 'serve'  // Only during dev
    }
  ]
})

Function form for more control:

{
  ...myPlugin(),
  apply(config, { command }) {
    // Apply only on build but not for SSR
    return command === 'build' && !config.build.ssr
  }
}

Finding Plugins

1. Check Vite Features Guide - many use cases are built-in
2. Official plugins in Vite Plugins
3. Community plugins in awesome-vite
4. Search npm for vite-plugin-* or rollup-plugin-*

Official Plugins

Plugin	Purpose
@vitejs/plugin-vue	Vue 3 SFC support
@vitejs/plugin-vue-jsx	Vue 3 JSX support
@vitejs/plugin-react	React with Babel/Oxc
@vitejs/plugin-react-swc	React with SWC
@vitejs/plugin-rsc	React Server Components
@vitejs/plugin-legacy	Legacy browser support

Rollup/Rolldown Plugin Compatibility

Many Rollup plugins work directly with Vite if they:

• Don't use moduleParsed hook
• Don't rely on Rolldown-specific options
• Don't have strong coupling between bundle and output phases

For build-only Rollup plugins:

export default defineConfig({
  build: {
    rolldownOptions: {
      plugins: [rollupPluginForBuildOnly()]
    }
  }
})