nlog

とめどなく流れるよだれ

React Static で Storybook をビルドしようとしたときに BABEL でエラー

React Static でつくったサイトのルートディレクトリで $npm run storybook をしたときにエラーがでた。

ERROR in ./.storybook/addons.js
Module build failed: Error: [BABEL] /Users/path/to/project/.storybook/addons.js: Couldn't resolve extends clause of /Users/path/to/project/react-static/.babelrc in base

...

ERROR in ./.storybook/config.js
Module build failed: Error: [BABEL] /Users/path/to/project/.storybook/config.js: Couldn't resolve extends clause of /Users/path/to/project/react-static/.babelrc in base

エラー内容で調べると以下のページにたどり着いた。

.babelrc を開いて extends の指定に ./node_modules/ を追加。以下のようにした。

{
  "extends": "./node_modules/react-static/.babelrc",
  ...
}

これでエラーが解消し、$npm run starthttp://localhost:3000 に React Static のページが、$npm run storybookhttp://localhost:6006 に Storybook のページが表示された。