К основному содержанию
скилл Claude Code CX Codex Cursor GitHub Copilot

vite — скилл для Claude Code: что делает и как установить

Скилл помогает настраивать Vite, писать плагины и собирать SSR-приложения. Пригодится для проектов с vite.config.ts и миграции на Rolldown.

Установить в Claude Code · Через Skills CLI (Vercel) Все способы и платформы ↓
npx skills add antfu/skills --skill vite -a claude-code
Открыть на GitHub

Что делает vite

Скилл разбирает конфигурацию Vite через vite.config.ts, defineConfig и loadEnv, а также работу с import.meta.glob, запросами ?raw и ?url, import.meta.env и HMR API. Он объясняет API плагинов Vite: хуки, виртуальные модули и порядок подключения.

Отдельные материалы посвящены режиму библиотеки, SSR middleware mode, ssrLoadModule, JavaScript API и Environment API. Есть раздел о Vite 8: сборщик Rolldown, трансформер Oxc и изменения конфигурации. В справке приведены команды vite, vite build, vite preview и vite build --ssr, а также плагины для Vue и React.

Скилл советует vite.config.ts и ESM, поэтому проект с CommonJS-конфигурацией стоит проверить перед применением этих рекомендаций.

Какие задачи решает

  • настроить vite.config.ts для проекта
  • подключить и упорядочить плагины Vite
  • собрать библиотеку или SSR-приложение
  • перенести конфигурацию на Rolldown
  • настроить импорт ассетов и переменных окружения

Примеры запросов агенту

  • Настрой `vite.config.ts` для приложения с алиасом `@` и прокси `/api`.
  • Покажи, как собрать это приложение в режиме SSR с помощью `vite build --ssr`.
  • Объясни, как перенести конфигурацию Vite 8 на Rolldown и Oxc.

Как установить vite

1Через Skills CLI (Vercel)

npx skills add antfu/skills --skill vite -a claude-code

2Вручную: положить файлы

~/.claude/skills/vite/SKILL.md

Папка скилла целиком; для одного проекта — .claude/skills/vite/

Из того же набора8

Весь набор →
vitest Anthony Fu Скилл помогает писать тесты на Vitest, настраивать моки и покрытие. Пригодится, когда нужно разобраться с фильтрацией тестов или фикстурами. Claude Code CX Codex Cursor +1 43 600установок vue Anthony Fu Скилл подсказывает агенту, как писать Vue 3-компоненты через Composition API и script setup. Нужен при работе с Vue SFC и реактивностью. Claude Code CX Codex Cursor +1 35 800установок nuxt Anthony Fu Скилл добавляет поддержку Nuxt 5 — полнофункционального Vue-фреймворка с серверным рендерингом, файловой маршрутизацией и автоимпортами. Помогает агенту писать серверные маршруты, работать с useFetch, middleware и гибридным рендерингом. Claude Code CX Codex Cursor +1 24 100установок pnpm Anthony Fu Скилл для работы с pnpm, менеджером пакетов Node.js со строгим разрешением зависимостей. Нужен, если в проекте используются рабочие пространства, каталоги версий, патчи или переопределения зависимостей. Claude Code CX Codex Cursor +1 22 300установок pinia Anthony Fu Скилл Pinia добавляет в Claude Code справку по официальной библиотеке управления состоянием Vue. Помогает при создании хранилищ, работе с состоянием, геттерами и действиями в Vue-приложениях. Claude Code CX Codex Cursor +1 19 700установок unocss Anthony Fu Скилл даёт агенту справочник по UnoCSS: конфиг, правила, шорткаты, пресеты и трансформеры. Пригодится при настройке проекта на UnoCSS или при переносе знаний Tailwind на него. Claude Code CX Codex Cursor +1 16 000установок nitro Anthony Fu Скилл подтягивает знания о Nitro v3: файловые маршруты, route rules, кэш, хранилище и пресеты деплоя. Пригодится, когда агент правит nitro.config или пишет обработчики H3. Claude Code CX Codex Cursor +1 2 600установок

Похожие

stitch::code-to-design официальный google-labs-code Переносит существующий фронтенд в Stitch: извлекает HTML и дизайн-систему, затем загружает их в проект. Пригодится для работы с уже готовыми страницами и компонентами. Claude Code CX Codex Cursor +1 10 100установок how-it-works thedotmack Скилл отвечает на вопросы об устройстве claude-mem. Он объясняет запись действий, хранение файлов и запуск подстановки контекста. Claude Code CX Codex Cursor +1 5 100установок pathfinder thedotmack Скилл строит схемы потоков по функциям проекта, ищет дублирование и предлагает свести повторяющиеся системы к общей архитектуре. Пригодится перед рефакторингом. Claude Code CX Codex Cursor +1 5 100установок stitch::upload-to-stitch официальный google-labs-code Скилл отправляет локальные изображения, макеты, разметку и HTML-страницы в проект Stitch напрямую по HTTP в обход ограничений вывода инструментов MCP. Claude Code CX Codex Cursor +1 9 900установок gh cli Учит агента вызывать GitHub CLI: структурированный JSON, пагинация, поиск issues и PR, загрузка файлов. Claude Code CX Codex Cursor +1 2 600установок inventory-demand-planning evos Скилл помогает прогнозировать спрос, считать страховой запас и планировать пополнение для розничных сетей с несколькими локациями. Claude Code CX Codex Cursor +1 4 500установок setup-matt-pocock-skills Matt Pocock Скилл настраивает репозиторий для инженерных скиллов Matt Pocock: задаёт трекер задач, метки триажа и расположение доменной документации. Запустите его перед первым использованием остальных скиллов. Claude Code 1 052 851установок to-tickets Matt Pocock Разбивает план, спецификацию или переписку на небольшие сквозные задачи и отмечает, какие из них блокируют остальные. Пригодится, когда нужно согласовать порядок работы до публикации задач в трекере. Claude Code 711 230установок

Вопросы о vite

Что делает скилл vite?

Он помогает работать с конфигурацией Vite, API плагинов, SSR, библиотечными сборками и импортами ассетов. Также он описывает миграцию Vite 8 на Rolldown и Oxc.

Какие рекомендации по конфигурации даёт скилл?

Он советует использовать TypeScript-файл vite.config.ts и ESM вместо CommonJS. В примерах есть defineConfig, алиасы, прокси и параметры сборки.

Исходный текст

SKILL.md · MIT
---
name: vite
description: Vite build tool configuration, plugin API, SSR, and Vite 8 Rolldown migration. Use when working with Vite projects, vite.config.ts, Vite plugins, or building libraries/SSR apps with Vite.
metadata:
  author: Anthony Fu
  version: "2026.9.25"
  source: Generated from https://github.com/vitejs/vite, scripts at https://github.com/antfu/skills
---

# Vite

> Based on Vite v8.3.1 (Rolldown-powered), generated at 2026-09-25. Vite 8 uses the Rolldown bundler and the Oxc transformer instead of esbuild + Rollup.

Vite is a next-generation frontend build tool with fast dev server (native ESM + HMR) and optimized production builds.

## Preferences

- Use TypeScript: prefer `vite.config.ts`
- Always use ESM, avoid CommonJS

## Core

| Topic | Description | Reference |
|-------|-------------|-----------|
| Configuration | `vite.config.ts`, `defineConfig`, conditional configs, `loadEnv` | [core-config](references/core-config.md) |
| Features | `import.meta.glob`, asset queries (`?raw`, `?url`), `import.meta.env`, HMR API | [core-features](references/core-features.md) |
| Plugin API | Vite-specific hooks, virtual modules, plugin ordering | [core-plugin-api](references/core-plugin-api.md) |

## Build & SSR

| Topic | Description | Reference |
|-------|-------------|-----------|
| Build & SSR | Library mode, SSR middleware mode, `ssrLoadModule`, JavaScript API | [build-and-ssr](references/build-and-ssr.md) |

## Advanced

| Topic | Description | Reference |
|-------|-------------|-----------|
| Environment API | Vite 6+ multi-environment support, custom runtimes | [environment-api](references/environment-api.md) |
| Rolldown Migration | Vite 8 changes: Rolldown bundler, Oxc transformer, config migration | [rolldown-migration](references/rolldown-migration.md) |

## Quick Reference

### CLI Commands

```bash
vite              # Start dev server
vite build        # Production build
vite preview      # Preview production build
vite build --ssr  # SSR build
```

### Common Config

```ts
import { defineConfig } from 'vite'

export default defineConfig({
  plugins: [],
  resolve: { alias: { '@': '/src' } },
  server: { port: 3000, proxy: { '/api': 'http://localhost:8080' } },
  build: { target: 'esnext', outDir: 'dist' },
})
```

### Official Plugins

- `@vitejs/plugin-vue` - Vue 3 SFC support
- `@vitejs/plugin-vue-jsx` - Vue 3 JSX
- `@vitejs/plugin-react` - React with Oxc/Babel
- `@vitejs/plugin-react-swc` - React with SWC
- `@vitejs/plugin-legacy` - Legacy browser support

© Anthony Fu · MIT · antfu/skills

Смотрите также

Спонсоры проекта

Компании, которые помогают держать аналитику открытой