【React/TypeScript】nodeのバージョンを上げて、storybook起動しようとしたら「TypeError: Cannot read properties of undefined (reading ‘createSnapshot’)」とか言われて、立ち上げられなかったのを解決した【Storybook】

症状が発生したきっかけ

Nodeのバージョンを18に上げたら急に立ち上げられなくなりました。

理由は調べたらいろいろ言及しているものがあったのですがここでは省略します。（「storybook node 18 」などでググるといろいろ出てきます）

行った解決策

私の場合、単純にstorybookリポジトリのこちらのissueのコメントにあった解決策を試したら解決しました。以下に手順を示します。

1. nodeモジュールの追加
   ・@storybook/builder-webpack5
   ・@storybook/manager-webpack5
   の2つのモジュールを追加します。

npm install @storybook/builder-webpack5@6.5.13 --save-exact
npm install @storybook/manager-webpack5@6.5.13 --save-exact

※バージョンはその時最新にするなど調整してください。

2. main.jsを修正
   　module.exports以下の内容が加わるように変更を加えてください。

module.exports = {
  core: {
    builder: "webpack5",
  },
}

以上の変更を行って、「npm run storybook」を実行したら無事storybookを立ち上げることができました。

以上です。

参考

• https://github.com/storybookjs/storybook/issues/18019