mcpField
A
astro-starlight

astro-starlight

github.com/fusengine開発3450 回インストール3 日前に更新
リポジトリ

astro-starlight について

Astro Starlightのドキュメントサイトを構築・カスタマイズするスキルです。技術文書、API文書、多言語文書を作る開発者向けに、Astro 7 Content Layerとの連携を含む固有の設定やプラグインを扱います。

主な機能

  1. 01ファイルシステムまたは手動のサイドバー設定
  2. 02Pagefind検索とDocSearchの選択肢
  3. 03ダーク・ライトモードのテーマ
  4. 04ドキュメント用プラグイン群
  5. 05多言語とhreflangのサポート
  6. 06Astro 7 Content Layer連携

活用シーン

  1. 01技術ドキュメントサイトの構築
  2. 02APIリファレンスの作成
  3. 03ブログやバージョン別文書の追加
  4. 04多言語ドキュメントの公開

インストール

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

$npx skills add https://github.com/fusengine/claude-plugins --skill astro-starlight

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

詳細

Astro 7 を基盤とするドキュメントテーマ Astro Starlight(0.42 以降、最新は 0.42.4。Astro 7.2.10 以降が必要です。0.41 で Astro 6 のサポートは終了しました)をセットアップしてカスタマイズします。ファイルシステムベースまたは手動でのサイドバー設定、組み込みの Pagefind 全文検索(またはトラフィックの多い大規模ドキュメント向けの DocSearch)、自動ダーク/ライトモード、プラグインエコシステム(AI による発見性を高める `starlight-blog`、`starlight-openapi`、`starlight-typedoc`、`starlight-versions`、`starlight-llms-txt`)を扱います。

また、Starlight のコンテンツモデルに固有の、hreflang 対応の多言語ドキュメントと Content Layer API の統合(docsLoader、スキーマ)、および CSS カスタムプロパティによるテーマ設定も扱います。Starlight 以外での一般的な Astro Content Layer の使用方法(astro-content)や、Starlight を使わない i18n ルーティング(astro-i18n)は対象外です。これらはそれぞれ専用のスキルで扱います。

Astro Starlight

検索、ダークモード、i18n、充実したプラグインエコシステムを備えた、本番環境対応の Astro 向けドキュメントテーマです。

エージェントのワークフロー(必須)

実装の前に、必ず以下の 3 つのエージェントを並行して起動してください。それぞれ name を指定して Agent を 1 回呼び出します。

  1. fuse-ai-pilot:explore-codebase - 既存の Starlight 設定、サイドバー、コンテンツ構造を分析します
  2. fuse-ai-pilot:research-expert - Context7/Exa を使って Starlight プラグインの API を確認します
  3. mcp__context7__query-docs - Content Layer と i18n のパターンについて Starlight のドキュメントを確認します

実装後、検証のために fuse-ai-pilot:sniper を実行してください。


概要

使用するケース
  • 技術ドキュメントサイトの構築
  • API リファレンスドキュメントの作成(starlight-openapi を使用)
  • TypeScript の型からドキュメントを生成(starlight-typedoc を使用)
  • ドキュメントサイトへのブログ追加(starlight-blog を使用)
  • バージョン管理されたドキュメントのセットアップ(starlight-versions を使用)
  • hreflang 対応の多言語ドキュメント
Starlight を選ぶ理由
機能利点
Pagefind を標準搭載全文検索、設定不要
ダーク/ライトモード自動対応、CSS カスタムプロパティ
サイドバー設定ファイルシステムベースまたは手動グループ
プラグインエコシステムDocSearch、ブログ、openapi、typedoc
Content Layer APIAstro 7 のコンテンツコレクションとの統合
llms.txt 対応AI による発見性を高める starlight-llms-txt
JavaScript 不要のモバイルメニュー(0.42)Popover API により、JavaScript が無効でもメニューが機能します。コンパイル済みの JS と .d.ts を同梱するため、tsc が高速化します

リファレンスガイド

概念
トピックリファレンス参照するタイミング
セットアップsetup.mdインストール、プロジェクト構成
サイドバーsidebar-config.mdナビゲーション、グループ、自動生成
検索search.mdPagefind、DocSearch、ページの除外
プラグインplugins.mdブログ、openapi、typedoc、versions
i18ni18n-multilang.mdロケール、翻訳、hreflang
Content Layercontent-layer.mddocsLoader、スキーマ、コレクション
カスタマイズcustomization.mdCSS 変数、コンポーネントのオーバーライド
テンプレート
テンプレート使用するケース
starlight-config.mdStarlight を含む完全な astro.config.mjs
sidebar-example.mdグループとバッジを含む複雑なサイドバー

ベストプラクティス

  1. まずはファイルシステムベースのサイドバーを使う - 必要になった場合にのみ手動設定を追加します
  2. 小規模なサイトでは Pagefind を使う - トラフィックの多い大規模ドキュメントには DocSearch を使用します
  3. starlight-llms-txt を使う - AI クローラーはドキュメントにとってますます重要になっています
  4. Content Layer のスキーマを使う - 型安全なフロントマターで実行時エラーを防ぎます
  5. CSS カスタムプロパティを使う - コンポーネントスロットを使わずにテーマをオーバーライドします

コメント