mcpField
V
vite

vite

github.com/antfu開発6.0k40.4k 回インストール6 日前に更新
リポジトリ

vite について

Vite は、フロントエンドプロジェクト向けのビルドツールで、開発サーバーと本番ビルドを提供します。ネイティブ ESM と HMR に加え、プラグイン、SSR、複数環境の設定に対応します。

主な機能

  1. 01ネイティブ ESM の開発サーバーと HMR
  2. 02最適化された本番ビルド
  3. 03プラグイン API と仮想モジュール
  4. 04ライブラリモードと SSR ビルド
  5. 05複数環境とカスタムランタイム

活用シーン

  1. 01フロントエンド開発サーバーの起動
  2. 02本番用ビルドの作成
  3. 03SSR またはライブラリモードの設定

インストール

コマンドをコピーしてターミナルで実行します。

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

インストール後、Claude Code で/viteを入力して読み込まれたか確認します。

同梱ファイル

SKILL.md と一緒にインストールされる参考資料やスクリプト。

GENERATION.md
references/
build-and-ssr.md
core-config.md
core-features.md
core-plugin-api.md
environment-api.md
rolldown-migration.md

詳細

Vite

Vite v8.3.1（Rolldown を採用）に基づいています。2026-09-25 に生成されました。Vite 8 では、esbuild + Rollup の代わりに Rolldown バンドラーと Oxc トランスフォーマーを使用します。

Vite は、高速な開発サーバー（ネイティブ ESM + HMR）と最適化された本番ビルドを備えた、次世代のフロントエンドビルドツールです。

設定の優先事項

  • TypeScript を使用します。vite.config.ts を優先してください
  • 常に ESM を使用し、CommonJS は避けてください

コア機能

トピック説明リファレンス
設定vite.config.ts、defineConfig、条件付き設定、loadEnvcore-config
機能import.meta.glob、アセットクエリ（?raw、?url）、import.meta.env、HMR APIcore-features
プラグイン APIVite 固有のフック、仮想モジュール、プラグインの順序core-plugin-api

ビルドと SSR

トピック説明リファレンス
ビルドと SSRライブラリモード、SSR ミドルウェアモード、ssrLoadModule、JavaScript APIbuild-and-ssr

高度な機能

トピック説明リファレンス
環境 APIVite 6+ の複数環境サポート、カスタムランタイムenvironment-api
Rolldown への移行Vite 8 の変更点：Rolldown バンドラー、Oxc トランスフォーマー、設定の移行rolldown-migration

クイックリファレンス

CLI コマンド
vite              # Start dev server
vite build        # Production build
vite preview      # Preview production build
vite build --ssr  # SSR build
一般的な設定
import { defineConfig } from 'vite'

export default defineConfig({
  plugins: [],
  resolve: { alias: { '@': '/src' } },
  server: { port: 3000, proxy: { '/api': 'http://localhost:8080' } },
  build: { target: 'esnext', outDir: 'dist' },
})
公式プラグイン
  • @vitejs/plugin-vue - Vue 3 SFC のサポート
  • @vitejs/plugin-vue-jsx - Vue 3 JSX
  • @vitejs/plugin-react - Oxc/Babel を使用した React
  • @vitejs/plugin-react-swc - SWC を使用した React
  • @vitejs/plugin-legacy - レガシーブラウザーのサポート

コメント

Markdown 対応