skills.rest
ryan-nguyen-01
ryan-nguyen-01COMMUNITY
Explore all skills by this author →
GitHub

skill-tooling-bundler

Automates frontend bundling decisions and optimization across Vite, esbuild, and Rollup for apps and libraries.

4|Updated Mar 31, 2026
Search Tags:#frontend#rollup#vite#bundling#esbuild#build-optimization
One-click install
npx skills add https://github.com/ryan-nguyen-01/agent-platform --skill skill-tooling-bundler
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: skill-tooling-bundler
Source: https://github.com/ryan-nguyen-01/agent-platform/tree/main/.claude/skills/skill-tooling-bundler
Command: npx skills add https://github.com/ryan-nguyen-01/agent-platform --skill skill-tooling-bundler

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Bundling frontend assets efficiently across Vite, esbuild, and Rollup can be complex and error-prone, making it hard to pick the right tool for the job and optimize builds for performance.

Core Features & Use Cases

  • Guidance on when to use Vite for web apps, esbuild for tooling, and Rollup for libraries, plus migration strategies between them.
  • Build optimizations including tree-shaking, code splitting, chunking, and caching, with a robust plugin ecosystem guidance.
  • Use cases include starting new projects, migrating legacy setups, and producing library bundles with clean package outputs.

Quick Start

Initialize a project with the recommended bundler (Vite for apps), apply basic code-splitting, and run the build to verify optimized outputs.

Frequently Asked Questions about skill-tooling-bundler

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

FAQPage Schema
When should I use Vite, esbuild, or Rollup for frontend bundling?▼

Use Vite for web apps, esbuild for tooling, and Rollup for libraries. The Skill guides you through selecting the right bundler based on project type and provides migration strategies between them.

How do I configure code splitting and manual chunking in Vite and Rollup?▼

Configure code splitting and manual chunking by defining chunking strategies in your bundler configuration. The Skill automates these decisions to optimize builds for performance and efficient caching.

What is the best way to optimize tree-shaking and plugin ecosystems for production builds?▼

Optimize tree-shaking and plugin ecosystems by applying production optimizations and analysis workflows. The Skill configures robust build pipelines to ensure clean package outputs and efficient web apps.

Can I use this bundler optimization approach for React and Vue projects?▼

Yes, the approach works across React, Vue, and library projects. It configures builds, code splitting, and plugin ecosystems tailored to your specific framework environment.

How do I migrate a legacy frontend bundling setup to Vite or Rollup?▼

Migrate legacy setups by following targeted migration strategies between Vite, esbuild, and Rollup. The Skill helps produce library bundles with clean package outputs while applying modern build optimizations.

Related Skills

Explore More Software Engineering Skills→
DaleSeoDaleSeo
4

bun-init

Initialize Bun projects with TypeScript and standard configuration files.

Community
Advanced
sgcarstrendssgcarstrends
21

bundle-analysis

Analyze JavaScript bundle sizes and identify optimization opportunities for Next.js apps.

Official
Advanced
oyjtoyjt
624

vite

Configure Vite dev servers, plugins, and production builds for Vue and React.

Community
Intermediate
VoTruongDanhVoTruongDanh

webpack-expert

Optimize Webpack configurations for build performance and module federation.

Community
Advanced