vite

Configure Vite projects with TypeScript configs, plugin hooks, and build/SSR guidance.

41|6|Updated Nov 27, 2025

Search Tags:#build #configuration #plugins #vite #ssr #rolldown #oxc

Ready to run

npx skills add https://github.com/mralexsaavedra/spotiarr --skill vite-mralexsaavedra

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: vite
Source: https://github.com/mralexsaavedra/spotiarr/tree/main/skills/vite
Command: npx skills add https://github.com/mralexsaavedra/spotiarr --skill vite-mralexsaavedra

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Vite users need a reliable guide for configuring builds and plugins correctly so their development experience stays fast and their production output behaves as expected.

Core Features & Use Cases

Configuration Patterns: Use Vite config techniques like defineConfig, env loading, aliases, and conditional config to keep setups clean and environment-aware.
Plugin API Guidance: Apply Vite plugin hooks (including config/configResolved/configureServer/transformIndexHtml) and understand ordering and conditional application.
Build & SSR/Libraries: Configure library mode, multi-page builds, and understand how low-level SSR primitives work with Vite 8 (Rolldown + Oxc).

Quick Start

Configure Vite using vite.config.ts by following the official configuration, plugin, and build/SSR guidance for Vite 8.

Frequently Asked Questions about vite

High-intent search queries and answers about installing and using this skill.

FAQPage Schema

How do I configure Vite plugins and hooks correctly in vite.config.ts?▼

Configure Vite plugins by applying hooks like config, configResolved, configureServer, and transformIndexHtml within vite.config.ts. Understanding plugin ordering and conditional application ensures your development server and build pipeline execute transformations correctly.

What is the best way to set up environment variables and aliases in a Vite project?▼

Set up environment variables and path aliases in Vite using defineConfig and conditional configuration. This ESM-first approach keeps your project environment-aware, ensuring clean imports and variable loading across different build stages.

Does Vite 8 support SSR and library builds with Rolldown and Oxc?▼

Yes, Vite 8 supports SSR and library builds using low-level primitives powered by Rolldown and Oxc. You can configure multi-page builds and library mode while following Rolldown and Oxc migration guidance for optimized production output.

How do Vite plugin hooks affect build behavior and ordering?▼

Vite plugin hooks directly affect build behavior by intercepting config resolution, server configuration, and HTML transformations. Proper ordering and conditional application of these hooks are critical to prevent conflicts and maintain expected build outputs.

Can I use TypeScript for ESM-first Vite configuration files?▼

Yes, you can use TypeScript for Vite configuration by authoring vite.config.ts. This approach satisfies ESM-first requirements, providing type safety and structured configuration for core features, plugins, and build settings.

What are the limitations when migrating to Vite 8 with Rolldown and Oxc?▼

When migrating to Vite 8 with Rolldown and Oxc, limitations arise from adapting existing configurations to new low-level SSR primitives and build behaviors. Following specific migration guidance is necessary to avoid unexpected production output issues.