First of all, you need to add a few storybook packages to your project's package.json.
To do that, simply run:
:::CodeSwitcher
npm i --save-dev @storybook/react @storybook/addons react react-dom| export const entries = ['**/*.stories.[t|j]s']; | |
| export const addons = ['docs', 'knobs']; | 
| export const entries = ['**/*.stories.[t|j]s']; | |
| export const babel = async (base, config) => ({ | |
| rootMode: 'upward', | |
| sourceType: 'unambiguous', | |
| }); | |
| export const webpack = async (base, config) => { | |
| const { default: webpackMerge } = await import('webpack-merge'); | 
| export const babel = async (base, config) => ({ | |
| rootMode: 'upward', | |
| sourceType: 'unambiguous', | |
| }); | 
| export const entries = ['**/*.stories.[t|j]s']; | |
| export const presets = ['babel/auto', 'sass']; | 
| export const webpack = async (base, config) => { | |
| const { default: webpackMerge } = await import('webpack-merge'); | |
| const { default: globToRegex } = await import('glob-to-regexp'); | |
| // here we request the resulting entries property | |
| // and transform the array of globs to an array of regular expressions | |
| const entries = (await config.entries).map(globToRegex); | |
| return webpackMerge(base, { | |
| module: { |