vite-expert

Diagnose Vite configurations and output guidance for build optimization.

Updated Dec 5, 2025
One-click install
npx skills add https://github.com/botPhU/project-An-English-speaking-practice-platform-supported-by-AI --skill vite-expert-botphu
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: vite-expert
Source: https://github.com/botPhU/project-An-English-speaking-practice-platform-supported-by-AI/tree/main/.agent/skills/vite-expert
Command: npx skills add https://github.com/botPhU/project-An-English-speaking-practice-platform-supported-by-AI --skill vite-expert-botphu

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Vite is a fast, modern bundler and development server, but optimizing its config for performance, caching, and plugin orchestration can be complex. This Skill provides expert guidance to diagnose bottlenecks, tune build targets, and implement advanced chunking and plugin strategies to accelerate both development and production builds.

Core Features & Use Cases

  • Advanced build optimization: tailor target environments, refine Rollup output, and configure manual chunks to minimize bundle size and optimize load times.
  • Dev server & HMR performance: tune Vite's server options, HMR handling, and caching to deliver near-instant feedback during development.
  • Plugin ecosystem mastery: advise on plugin selection and ordering, legacy support, and analysis tooling to maintain fast builds across projects.
  • Use Case: A project with slow rebuilds and large bundles can benefit from a formal Vite optimization review that proposes concrete config changes, plugin usage, and performance monitoring.

Quick Start

Ask the vite-expert to audit your project by providing your vite.config.js or repository path and request a "build optimization audit" for rapid improvements.

Frequently Asked Questions about vite-expert

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

FAQPage Schema
How do I optimize large bundle size and slow builds in Vite?

Vite build optimization involves diagnosing bottlenecks and adjusting configuration to refine Rollup output, configure manual chunks, and tailor target environments. This minimizes bundle size and accelerates production builds.

Why does my Vite dev server have slow HMR performance?

Slow Vite HMR performance often stems from unoptimized server options or inefficient plugin orchestration. Tuning Vite's server options, HMR handling, and caching strategies delivers near-instant feedback during development.

What is the best way to manage Vite plugin selection and ordering?

Vite plugin management requires strategic selection, ordering, and legacy support to maintain fast builds. Expert guidance advises on plugin orchestration to prevent bottlenecks and ensure smooth operation across projects.

Does Vite work with SSR configuration in production environments?

Vite supports SSR configuration for both production and development contexts. You can optimize runtime performance by diagnosing bottlenecks and adjusting SSR configuration patterns alongside bundling strategies.

How do I audit my Vite configuration for performance improvements?

You can audit Vite configuration by providing your vite.config.js file and requesting a build optimization audit. This outputs actionable guidance for target browsers, chunking, and performance monitoring.