design-system/.storybook/main.js at 45def45bcca2fbdc551004d82eb9d8f25f4c2a30 · ibexa/design-system · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
const NodePolyfillPlugin = require('node-polyfill-webpack-plugin');
const path = require('path');

/** @type { import('@storybook/react-webpack5').StorybookConfig } */
const config = {
    stories: ['../packages/**/*.stories.@(js|jsx|mjs|ts|tsx)', '../stories/*.stories.@(js|jsx|mjs|ts|tsx)'],
    staticDirs: ['../packages/assets/src/'],
    addons: [
        '@storybook/addon-docs',
        '@storybook/addon-webpack5-compiler-swc',
        '@storybook/addon-a11y',
        'storybook-addon-pseudo-states',
        {
            name: '@storybook/addon-coverage',
            options: {
                istanbul: {
                    exclude: ['**/.storybook/**', '**/*.stories.*', '**/storybook-static/**', '**/storybook/**'],
                },
            },
        },
        {
            name: '@storybook/addon-styling-webpack',
            options: {
                rules: [
                    {
                        test: /\.scss$/,
                        use: [
                            'style-loader',
                            'css-loader',
                            {
                                loader: 'sass-loader',
                                options: { implementation: require.resolve('sass') },
                            },
                        ],
                    },
                ],
            },
        },
        path.resolve(__dirname, '../src/storybook/addons/framework-selector/index.ts'),
    ],
    framework: {
        name: '@storybook/react-webpack5',
        options: {},
    },
    typescript: {
        check: true,
    },
    webpackFinal: async (webpackConfig) => {
        webpackConfig.module.rules.push({
            test: /\.xliff$/,
            use: ['raw-loader'],
        });

        webpackConfig.resolve.alias = {
            ...webpackConfig.resolve.alias,
            '@ids-context': path.resolve(__dirname, '../packages/components/src/context'),
            '@ids-internal': path.resolve(__dirname, '../packages/components/src/internal'),
        };

        webpackConfig.plugins.push(new NodePolyfillPlugin());

        return webpackConfig;
    },
    env: (envConfig) => ({
        ...envConfig,
        TWIG_COMPONENTS_URL: 'http://localhost:8000/storybook/preview',
    }),
};
export default config;