Agent skill
vite-config-generator
Generate Vite configuration files for fast frontend development with React, Vue, or vanilla JavaScript projects. Triggers on "create vite config", "generate vite configuration", "vite setup for", "vite.config".
Install this agent skill to your Project
npx add-skill https://github.com/ehtbanton/ClaudeSkillsRepo/tree/main/vite-config-generator
SKILL.md
Vite Config Generator
Generate production-ready Vite configuration files with plugins, build optimization, and development server settings.
Output Requirements
File Output: vite.config.ts or vite.config.js
Format: Valid Vite configuration
Standards: Vite 5.x
When Invoked
Immediately generate a complete Vite configuration with appropriate plugins, alias paths, build settings, and dev server configuration.
Configuration Template
import { defineConfig } from 'vite';
import react from '@vitejs/plugin-react';
import path from 'path';
export default defineConfig({
plugins: [react()],
resolve: {
alias: { '@': path.resolve(__dirname, './src') },
},
server: {
port: 3000,
open: true,
},
build: {
outDir: 'dist',
sourcemap: true,
},
});
Example Invocations
Prompt: "Create vite config for React TypeScript with path aliases"
Output: Complete vite.config.ts with React plugin, aliases, and optimizations.
Recommended Agent Skills
Expand your agent's capabilities with these related and highly-rated skills.
esbuild-config-generator
Generate esbuild configuration files for ultra-fast JavaScript/TypeScript bundling. Triggers on "create esbuild config", "generate esbuild configuration", "esbuild setup", "fast bundler config".
lint-staged-config-generator
Generate lint-staged configuration for running linters on staged Git files. Triggers on "create lint-staged config", "generate lint staged", "lint-staged setup", "staged file linting".
rollup-config-generator
Generate Rollup configuration files for bundling JavaScript libraries. Triggers on "create rollup config", "generate rollup configuration", "rollup setup", "library bundler config".
eslint-config-generator
Generate ESLint configuration files (.eslintrc.js, eslint.config.js) for JavaScript/TypeScript projects with framework-specific rules. Triggers on "create ESLint config", "generate eslint configuration", "eslint setup for", "linting rules for".
csp-header-generator
Generate Content Security Policy (CSP) header configurations for web security. Triggers on "create csp header", "generate content security policy", "csp config", "security headers".
prisma-schema-builder
Generate Prisma schema files with models, relations, enums, and database configuration for TypeScript ORM setup. Triggers on "create Prisma schema", "generate Prisma model", "prisma.schema for", "database schema Prisma".
Didn't find tool you were looking for?