import { dirname } from 'path'; import { fileURLToPath } from 'url'; import type { StorybookConfig } from '@storybook/react-vite'; import react from '@vitejs/plugin-react'; /** * This function is used to resolve the absolute path of a package. * It is needed in projects that use Yarn PnP or are set up within a monorepo. */ function getAbsolutePath(value: string) { return dirname(fileURLToPath(import.meta.resolve(`${value}/package.json`))); } const config: StorybookConfig = { stories: [ '../src/Concepts/*.mdx', '../src/Themes/*.mdx', '../src/**/*.mdx', '../src/**/*.stories.@(js|jsx|mjs|ts|tsx)', ], addons: [ getAbsolutePath('@chromatic-com/storybook'), getAbsolutePath('@storybook/addon-a11y'), getAbsolutePath('@storybook/addon-docs'), ], framework: getAbsolutePath('@storybook/react-vite'), core: { disableTelemetry: true, }, staticDirs: ['./public'], async viteFinal(config) { const { mergeConfig } = await import('vite'); return mergeConfig(config, { plugins: [react()], resolve: { tsconfigPaths: true, }, }); }, }; export default config;