starwind-pro について
starwind-pro は、Astro プロジェクトで Starwind UI v3 Pro ブロックを使うためのスキルです。設定、利用条件、アクセシビリティを考慮した検索、導入、調整の手順を示します。
主な機能
- 01Astro と Starwind の設定確認
- 02用途、カテゴリ、プラン別の検索
- 03指定コマンドによるブロック導入
- 04レイアウト、モーション、テーマ、アクセシビリティの調整
- 05プレミアムブロックの利用条件確認
活用シーン
- 01Astro ページに適したブロックの選定
- 02既存 Starwind プロジェクトでの Pro 設定
- 03ルートへのブロック追加とサンプル内容の置換
- 04導入後のビルドとページ動作の確認
MCP 対応
MCP の starwind_search ツール、または CLI の starwind search --json でブロックを検索できます。返されたインストールコマンドでブロックを追加します。
インストール
コマンドをコピーしてターミナルで実行します。
$
npx skills add https:/ / github.com/ starwind-ui/ skills --skill starwind-proインストール後、Claude Code で/starwind-proを入力して読み込まれたか確認します。
同梱ファイル
SKILL.md と一緒にインストールされる参考資料やスクリプト。
blocks.mdsetup.mdagents/openai.yml詳細
Starwind Pro
Starwind Pro は Starwind UI v3 を基盤としています。公開ブロックは引き続き Astro コンポーネントとしてアプリケーションにインストールされ、ローカルでカスタマイズされます。
ルール
- Pro ブロックを選択する前に、対象が Astro であることを確認してください。
starwind.config.jsonを、フレームワーク、コンポーネントの配置先、レジストリ、Tailwind、Pro の認可設定に関する V3 の正式な設定として扱ってください。- Starwind UI がない場合は
starwind init --framework astro --proで初期化し、既存のプロジェクトではstarwind setupを使用してください。 - ブロック名を挙げる前に、最新の MCP、CLI、または Pro メタデータを検索してください。
- 返された正確なインストールコマンドを使用し、宣言されているコンポーネントの依存関係を維持してください。
- デモコンテンツを置き換える際は、ブロックのレスポンシブレイアウト、コンテナークエリ、モーションと動きを抑える設定の動作、アクセシビリティ、ライト/ダークテーマの仕様を維持してください。
- 無料ブロックとプレミアムブロックを区別してください。プレミアムブロックの利用にはアクセス権が必要です。利用可否はメタデータで確認してください。
STARWIND_LICENSE_KEYは.env.localまたはシークレットマネージャーに保管し、コード、ログ、チャット、引き継ぎ文には含めないでください。
コンテキスト
ブロックを推奨またはインストールする前に、次の項目を確認してください。
package.json、ロックファイル、astro.config.*、変更対象のルート/レイアウト。starwind.config.json、設定済みのコンポーネントディレクトリ、インストール済みの記録、ローカルエクスポート。- 設定で指定されている Starwind の CSS ファイルと、既存のテーマ規約。
- セットアップによって
.env.localが作成または更新される可能性がある場合は、.gitignore。
古い components.json に旧 Pro レジストリ設定が含まれている場合、現在のセットアップではそれらをインポートできますが、内容が異なる場合は starwind.config.json が優先されます。
検索、インストール、適応
- 新規プロジェクトでは
starwind init --framework astro --proで初期化します。Starwind の初期化済みプロジェクトでは、Pro の設定がない場合に一度starwind setupを実行します。 - 最新の MCP
starwind_searchまたはstarwind search <query> --jsonを使用して、目的/カテゴリ/プランで検索します。 - プランと依存関係がプロジェクトに合う結果を選択します。
- プロジェクトのルートから、表示された正確なインストールコマンドを実行します。
- 追加されたすべてのブロックとコンポーネントのファイルを確認します。
- ローカルエイリアスを使って、目的の Astro ルートに組み込みます。
- レスポンシブ、コンテナークエリ、アニメーション、アクセシビリティ、テーマの動作を維持しながら、プレースホルダーのコンテンツ、リンク、データ、画像を置き換えます。
- 関連するフォーマット、型チェック、ビルド、ページ/ブラウザーのチェックを実行します。
ソースと依存関係が設定済みの場所にインストールされ、プレースホルダーのコンテンツが解決され、インポートを含むビルドが成功し、アクセス要件が正確に報告されたら、ブロックの作業は完了です。
参照
コメント
Markdown 対応