storybook-init について
Storybook の初期化を支援するスキルです。既存の導入状況と最新安定版を確認し、適切なインストールコマンドを選んで `/storybook-setup` による設定へ進みます。
主な機能
- 01Storybook 導入済みか確認
- 02最新安定版の確認
- 03適切な create-storybook タグの選択
- 04`/storybook-setup` の呼び出し
活用シーン
- 01Storybook の重複インストール回避
- 02新規プロジェクトでの Storybook 導入
- 03プロジェクト固有の Storybook 設定
インストール
コマンドをコピーしてターミナルで実行します。
$
npx skills add https:/ / github.com/ storybookjs/ storybook --skill storybook-initインストール後、Claude Code で/storybook-initを入力して読み込まれたか確認します。
詳細
Storybook がすでにインストールされている場合(package.json に storybook 依存関係がある、または .storybook/ ディレクトリがある場合)は、再インストールせず、/storybook-setup に切り替えてください。
- まず、
npm view create-storybook versionを実行して最新の安定版を確認してください。11.0 未満の場合は、11.0 のアルファ版を使用するため、プロジェクトのルートディレクトリでnpm create storybook@nextを実行してください。それ以外の場合は、npm create storybook@latestを実行してください。必要に応じて、pnpm create storybook@nextのように、同じタグを使った対応するパッケージマネージャーのコマンドを使用してください。 /storybook-setupスキルを呼び出して、.storybook/preview.tsファイルなど、プロジェクト固有の Storybook 設定をユーザーが行えるよう支援してください。
コメント
Markdown 対応