vite

Name: vite
Author: uni-helper

github.com/uni-helperDevelopment111752 installsUpdated 39w ago

About vite

A Vite 6.x skill for frontend developers, covering configuration, development, and production builds. It also documents plugins, framework integrations, and advanced APIs.

Key features

01Configuration and CLI commands
02TypeScript, JSX, and CSS handling
03Plugins and static assets
04Environment variables and HMR
05Production, library, and SSR builds
06JavaScript and plugin APIs

Use cases

01Configure a Vite project
02Set up a development server
03Build a library or multi-page app
04Integrate Vite with a backend

Install

Copy the command and run it in a terminal.

$npx skills add https://github.com/uni-helper/skills --skill vite

After installing, type/vitein Claude Code to confirm it loaded.

Bundled files

References and scripts installed along with SKILL.md.

GENERATION.md

LICENSE.md

SYNC.md

references/

advanced-api.md

advanced-backend.md

advanced-performance.md

advanced-plugin-api.md

build-library.md

build-production.md

build-ssr.md

core-cli.md

core-config.md

core-features.md

core-plugins.md

features-assets.md

features-css.md

features-dep-bundling.md

features-env.md

features-glob-import.md

features-hmr.md

features-workers.md

Details

From the project README

Vite is a modern build tool for frontend development featuring instant server start with native ES modules, lightning-fast HMR, and optimized production builds using Rolldown/Rollup. It supports TypeScript, JSX, CSS pre-processors out of the box and has a rich plugin ecosystem.

The skill is based on Vite 6.x, generated at 2026-01-28.

Core

Topic	Description	Reference
Configuration	Config file setup, defineConfig, conditional and async configs	core-config
CLI Commands	Dev server, build, preview commands and options	core-cli
Core Features	TypeScript, JSX, CSS, HTML processing, JSON handling	core-features
Using Plugins	Adding, configuring, and ordering plugins	core-plugins

Features

Topic	Description	Reference
CSS Handling	CSS modules, pre-processors, PostCSS, Lightning CSS	features-css
Static Assets	Asset imports, public directory, URL handling	features-assets
Glob Import	import.meta.glob, dynamic imports, batch loading	features-glob-import
Environment Variables	.env files, modes, import.meta.env constants	features-env
HMR API	Hot Module Replacement client API	features-hmr
Web Workers	Worker imports and configuration	features-workers
Dependency Pre-Bundling	optimizeDeps, caching, monorepo setup	features-dep-bundling

Build

Topic	Description	Reference
Production Build	Build options, browser targets, multi-page apps	build-production
Library Mode	Building libraries with proper package exports	build-library
SSR	Server-side rendering setup and configuration	build-ssr

Advanced

Topic	Description	Reference
JavaScript API	createServer, build, preview programmatic APIs	advanced-api
Plugin API	Creating Vite plugins, hooks, virtual modules	advanced-plugin-api
Performance	Optimization tips for dev server and builds	advanced-performance
Backend Integration	Integrating Vite with traditional backends	advanced-backend

Comments

Markdown supported

Details

Author: uni-helper
Repository: uni-helper/skills
Category: Development
Installs: 752
GitHub stars: 111

Report

More skills

All skills

remotion-render

github.com/inference-sh

1.6M

Render videos from React/Remotion component code via inference.sh. Pass TSX code, get MP4. Supports all Remotion APIs: useCurrentFrame, useVideoConfig, spring, interpolate, AbsoluteFill, Sequence. Configurable resolution, FPS, duration, codec. Use for: programmatic video generation, animated graphics, motion design, data-driven videos, React animations to video. Triggers: remotion, render video from code, tsx to video, react video, programmatic video, remotion render, code to video, animated video, motion graphics code, react animation video

improve-codebase-architecture

github.com/mattpocock

1.2M

Scan a codebase for architecture improvement opportunities, present them as a visual HTML report, then dive deep into whichever one you pick.

design-mobile-apps

github.com/designed-by-ai

1.1M

Design mobile app screens with Sleek, edit Sleek projects, and implement their designs in React Native or HTML

vercel-react-best-practices

github.com/vercel-labs

858.0k

React and Next.js performance optimization guidelines from Vercel Engineering. This skill should be used when writing, reviewing, or refactoring React/Next.js code to ensure optimal performance patterns. Triggers on tasks involving React components, Next.js pages, data fetching, bundle optimization, or performance improvements.