create-react-appでstorybookを利用する

[kurodakazumichi]

グローバル空間を汚染せずに、プロジェクト内で完結させたい。

参考
https://storybook.js.org/basics/guide-react/

[kurodakazumichi]

参考サイトの手順通りに構築

• npm install --save-dev @storybook/react
• .storybook/config.jsを作成
• index.jsを作成
• package.jsonにコマンドを定義

npm run storybook

> react-lab@0.1.0 storybook /Users/kazumichi/work/React/react-lab
> start-storybook -p 9001 -c .storybook

info @storybook/react v3.4.11
info
info => Using default webpack setup based on "Create React App".
/Users/kazumichi/work/React/react-lab/node_modules/webpack/lib/DefinePlugin.js:93
                compiler.hooks.compilation.tap(
                               ^

TypeError: Cannot read property 'compilation' of undefined

というわけでエラーでうまくいかないです。

[kurodakazumichi]

storybookjs/storybook#3313

webpackの問題でうまくいかないっぽい？

[kurodakazumichi]

めんどくさくなったのでとりあえずグローバル汚染しつつもできるかやってみよう。

[kurodakazumichi]

npm install -g @storybook/cli
getstorybook
npm run storybook

storybookは起動したが

Module build failed: Error: Plugin/Preset files are not allowed to export objects, only functions.