Storybook6.4からstoriesの指定に{}が使えなくなった件

背景

storybookのバージョンを6.4にupdateした時に、ビルド自体は問題なかったが実際に開いて確認してみるとCouldn't find any stories in your Storybook.のエラーが出ていたので調査しました。

実際以下のようにstoriesを設定していました。

.storybook/main.js

module.exports = {
  stories: ['../{components,pages}/**/*.stories.tsx'],
  ・・・
}

結論

storybook6.4からglobの判定がmicromatchというやつからpicomatchというのに変更になり、{}による展開が不可になったようです。なのでstoriesの配列にそれぞれ分けて記載すれば動作するようになります。

.storybook/main.js

module.exports = {
  stories: ['../components/**/*.stories.tsx','../pages/**/*.stories.tsx'],
  ・・・
}

ドキュメントもしれっと6.3⇨6.4でmicromatchからpicomatchに変更されています。

参考