skills.rest
harryy2510
harryy2510COMMUNITY
Explore all skills by this author →
WebsiteGitHub

vite

Configure Vite projects and migrate to Rolldown with structured references.

Updated Apr 5, 2026
Search Tags:#migration#build#config#vite#ssr#rolldown#plugin-api
One-click install
npx skills add https://github.com/harryy2510/dotclaude --skill vite-harryy2510
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: vite
Source: https://github.com/harryy2510/dotclaude/tree/main/plugins/dotclaude/skills/vite
Command: npx skills add https://github.com/harryy2510/dotclaude --skill vite-harryy2510

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This skill provides a structured, ready-to-reference guide for configuring, extending, and migrating Vite projects, covering vite.config.ts patterns, plugin API usage, SSR considerations, and Vite 8 Rolldown migration notes.

Core Features & Use Cases

  • Comprehensive configuration patterns for vite.config.ts using defineConfig and environment variables.
  • Plugin API guidance for extending Vite with custom plugins, server hooks, and HTML transforms.
  • Migration guidance for moving from Rollup/esbuild setups to Rolldown in Vite 8, including example mappings and common pitfalls.
  • Use Case: Build and optimize library projects, multi-environment apps, and SSR setups with Vite.

Quick Start

Create a basic vite.config.ts with defineConfig and start the Vite dev server to see changes.

Frequently Asked Questions about vite

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

FAQPage Schema
How do I configure vite.config.ts for a multi-environment frontend project?▼

Vite configuration uses defineConfig to manage environment variables and build settings across multiple environments. You can structure vite.config.ts with conditional logic to handle environment-specific variables for frontend projects.

How do I write a custom Vite plugin with server hooks?▼

Vite plugin API guidance allows extending Vite with custom plugins, server hooks, and HTML transforms. You configure plugins by exporting functions that hook into the Vite dev server lifecycle to modify responses or handle requests.

What is the Vite 8 Rolldown migration process from Rollup?▼

Vite 8 Rolldown migration involves moving from Rollup and esbuild setups to Rolldown using provided example mappings and common pitfalls. The migration notes offer structured guidance for transitioning existing build configurations.

Does Vite SSR configuration require specific server setup patterns?▼

Vite SSR setups require specific configuration patterns to handle server-side rendering environments correctly. You configure server options within vite.config.ts to manage module loading and source transformation for SSR.

What are common pitfalls when migrating to Rolldown in Vite?▼

Common pitfalls during Rolldown migration in Vite include misconfigured build outputs and incompatible Rollup plugin APIs. The migration notes provide example mappings to help identify and avoid these frequent configuration errors.

Can I use Vite to build and optimize a JavaScript library project?▼

Vite supports building and optimizing library projects through structured config patterns in vite.config.ts. You define library mode build options to output optimized bundles for JavaScript or TypeScript libraries.

Related Skills

Explore More Software Engineering Skills→
jieni777jieni777
1

bundle-checker

Analyze project dependencies and build configuration to identify bundle size issues.

Community
Intermediate
alexanderopalexanderop
8

vite

Configure Vite projects and plugin APIs for faster builds.

Community
Intermediate
ehtbantonehtbanton

vite-config-generator

Generate Vite configuration files for JavaScript or TypeScript frontend projects.

Community
Intermediate
partme-aipartme-ai
610

rollup

Configure Rollup bundlers with plugins, code splitting, and tree shaking.

Official
Intermediate