VSCode拡張機能: Open Storybook – 必要なStorybookだけをすばやく実行する

背景

私たちのチームは、Storybookを実行する際に速度の問題を抱えていました。
プロジェクトが大きくなるにつれてStorybook全体のビルド時間が徐々に長くなり、
テストしたいストーリーの一部だけを開きたいのに、毎回Storybook全体を実行したり、.storybook/main.tsでパスを修正したりしなければならない不便さがありました。

これを解決するために、VSCode拡張機能の「Open Storybook」を作りました。
Jest Runnerのように、Storybookも「ファイルエクスプローラーで特定のフォルダだけを選んで実行」または「必要なStorybookファイルを選んで実行」できるようにしました。

機能

• フォルダ - 右クリック - Open Storiesコマンド: そのフォルダ内のすべてのStorybookを追加で開けます。
• コマンドパレット: Open Storybookコマンド: コマンドで開いているStorybookがあれば、既存のものと新しいStorybookをまとめて表示できます。（Open Storiesで開いた場合も同様にまとめられます。）
• モノレポ管理: パッケージごとにStorybookのターミナルを個別に管理します。
• scriptからstorybookコマンドを探して実行します。なければnpx storybookで実行します。

インストール

• extensionでroseline-song.open-storybookまたはopen storybookを検索
• Cursorの場合: vscodeバージョンの互換性エラーが発生する場合は、install横の歯車ボタンをクリック - install specific version - 最新バージョンをインストール

[guseod24]

0.0.5 バージョン

Storybook ではないファイルを Open Storybook で開こうとした場合にエラートーストを表示
package ごとに Storybook のパスが継続的に蓄積されていく問題を修正
Storybook ターミナル終了時に main.ts を復元