見出し画像

StorybookでModuleNotFoundError コンポーネントのインポートができない...

初めてStoriesを作ろうと思ったら、

ModuleNotFoundError: Module not found: Error:
Can't resolve 'components/common/footer/FooterMenuItem' in '/Users/maimaineet/Workspace/hoge/fuga/stories/common/footer'

と言われてしまった……

解決策

.storybook/main.jsで、絶対パスの設定をする。

const path = require('path') // 追記

module.exports = {
  stories: ...
  addons: [
      ...
  ],
  // 以下、追記
  webpackFinal: async (baseConfig) => {
    baseConfig.resolve.modules = [
      ...(baseConfig.resolve.modules || []),
      path.resolve(__dirname, '../'),
    ]
    return baseConfig
  },
}

参考:Storybook(ver.6系)でNext.jsの絶対パスインポートに対応する


ベースのパスを指定してあげないといけないみたいです。


この記事が気に入ったらサポートをしてみませんか?