UGA Boxxx

つぶやきの延長のつもりで、知ったこと思ったこと書いてます

【Storybook】v5.2.xからv6に更新してみた

Storybookを5.2.xを使っているが、現在は6系があるようなので無邪気にバージョンアップしてみた

$ npx sb upgrade

エラーが発生したので解いていく

発生したエラー

Core-JS dependency errors

Module not found: Error: Can't resolve 'core-js/modules/web.dom-collections.iterator

複数のcore-jsのバージョンがある場合に発生する模様
storybook/MIGRATION.md at next · storybookjs/storybook · GitHub

プロジェクトに直接インストールするのが解決策みたい

npm install core-js@^3.0.1 --save-dev

Cannot read property 'fonts' of undefined"

これはちょっと解決できなかった
v5.2系 から v5.3系で大きな変更があったみたいなので、いきなり v5.2からv6は無謀だったのかも?

5.2 > 5.3のときの変更点を取り入れる

  • presets.jsmain.jsに名前が変わった
    main.js はStorybookの基本の設定ファイル
  • config.jspreview.jsに名前が変わった
    preview.jsコンポーネントをレンダーする"preview"iframeの設定ファイル
  • addons.jsmanager.jsに名前が変わった
    manager.jsは addonsパネルなど、"preview"をラップするStorybookの管理ファイル.

storybook/MIGRATION.md at master · storybookjs/storybook · GitHub

5.2 > 6はうまくいかなかったので、まずは5.3にあげてみる