mcpField
V
vitepress

vitepress

github.com/hairyf開発26104 回インストール4 週間前に更新
リポジトリ

vitepress について

VitePress 1.x プロジェクト向けのスキルで、ドキュメント、ブログ、マーケティングサイトの構築と保守を支援します。設定、Markdown、ルーティング、テーマ、デプロイに関するガイドをまとめています。

主な機能

  1. 01設定とコマンドラインのガイド
  2. 02ファイルベースのルーティングとMarkdown
  3. 03Markdown内でのVueコンポーネント
  4. 04テーマのカスタマイズと検索
  5. 05多言語対応とデプロイ

活用シーン

  1. 01VitePressでのドキュメントサイト作成
  2. 02カスタムテーマとVueコンテンツの追加
  3. 03多言語サイトの設定
  4. 04静的サイトのデプロイ準備

インストール

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

$npx skills add https://github.com/hairyf/skills --skill vitepress

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

同梱ファイル

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

GENERATION.md
references/
advanced-i18n.md
advanced-ssr.md
core-cli.md
core-config.md
core-markdown.md
core-routing.md
features-code-blocks.md
features-data-loading.md
features-dynamic-routes.md
features-vue.md
recipes-deploy.md
theme-config.md
theme-custom.md
theme-customization.md

詳細

VitePress は、Vite と Vue 3 を基盤に構築された静的サイトジェネレーター（SSG）です。Markdown コンテンツにテーマを適用し、静的 HTML を生成します。生成された HTML は、すばやく移動できる SPA として動作します。ドキュメント、ブログ、マーケティングサイトに最適です。

主な特徴：

  • .md ファイルによるファイルベースのルーティング
  • Vue コンポーネントを Markdown 内で直接使用可能
  • 高速な HMR による即時更新（<100ms）
  • ドキュメント向けに最適化されたデフォルトテーマ
  • 組み込みの検索機能（ローカルまたは Algolia）

VitePress プロジェクトで作業する前に：

  • サイト設定については .vitepress/config.ts を確認します
  • カスタムテーマの拡張については .vitepress/theme/ を確認します
  • public/ ディレクトリには、そのまま配信される静的アセットが含まれています

このスキルは VitePress 1.x に基づいており、2026-01-28 に生成されました。

コア

トピック説明リファレンス
設定設定ファイルのセットアップ、defineConfig、サイトメタデータcore-config
CLIコマンドラインインターフェース：dev、build、preview、initcore-cli
ルーティングファイルベースのルーティング、ソースディレクトリ、書き換えcore-routing
MarkdownFrontmatter、コンテナ、テーブル、アンカー、インクルードcore-markdown

機能

コードとコンテンツ
トピック説明リファレンス
コードブロックシンタックスハイライト、行のハイライト、差分、フォーカスfeatures-code-blocks
Markdown 内の Vueコンポーネント、script setup、ディレクティブ、テンプレートfeatures-vue
データ読み込みビルド時のデータローダー、createContentLoaderfeatures-data-loading
動的ルートデータからページを生成、パスローダーファイルfeatures-dynamic-routes

テーマ

トピック説明リファレンス
テーマ設定ナビゲーション、サイドバー、検索、ソーシャルリンク、フッターtheme-config
カスタマイズCSS 変数、スロット、フォント、グローバルコンポーネントtheme-customization
カスタムテーマテーマの一からの構築、テーマインターフェースtheme-custom

高度なトピック

トピック説明リファレンス
国際化多言語サイト、ロケール設定advanced-i18n
SSR 互換性サーバーサイドレンダリング、ClientOnly、動的インポートadvanced-ssr

レシピ

トピック説明リファレンス
デプロイGitHub Pages、Netlify、Vercel、Cloudflare、Nginxrecipes-deploy

コメント

Markdown 対応