Use with Storybook

Hello,

according to Storybook, it’s possible to use our own webpack.config.js (https://storybook.js.org/configurations/custom-webpack-config/#using-your-existing-config) to configure Storybook as well.

How would you wire Storybook and craco to use the same configuration?

The most simple would be to provide the function which computes the craco config into the webpack config?

Something like :

// .storybook/webpack.config.js
const { craco } = require('@craco/craco')
module.exports = craco(require('../craco.config.js'))

[patricklafrance]

I know it’s been a while but it should work now with the new API.

Documentation available here.

[danielknell]

I hit problems with Craco and storybook last night so built an experimental preset based on preset-create-react-app to use the webpack config from Craco instead of pulling it directly from react-scripts.

This means any Craco plugins, changes postcss plugins, manual webpack tweaks, etc will also be applied to storybook.

Its a bit hackey at the moment and calls out to internal apis inside preset-create-react-app but that seemed like a better choice than re-inventing the wheel.

Any feedback, contributions, fixes, etc are welcome, it would be good to have solid integration between storybook and Craco.

• Github Repo
• Yarn
• NPM