0

我使用了插件故事截图。但是后来我开玩笑地运行测试我有一个错误。我阅读了许多资源如何解决这个问题,但我发现的所有资源都对我没有帮助。故事书问题示例

请帮我。

错误信息

我的配置文件:

故事书版

@storybook/react: "^5.3.13",
@storybook/addon-knobs: "^5.3.13",
@storybook/addon-info: "^5.3.13",
@storybook/addon-storyshots: "^5.3.13",

storyshots.test.js

import initStoryshots from '@storybook/addon-storyshots';

initStoryshots();

webpack.config.js

    config.module.rules.push(
        {
            test: /\.css$/,
            exclude: /node_modules(?!\/@storybook\/addon-info)/,
            use: ['style-loader', 'css-loader']
        },
        {
            test: /\.(sass|scss)$/,
            use: [
                {
                    loader: 'style-loader'
                },
                { loader: 'css-loader' },
                {
                    loader: 'postcss-loader',
                    options: {
                        plugins() {
                            return [require('precss'), require('autoprefixer')];
                        }
                    }
                },
                {
                    loader: 'sass-loader',
                    options: {
                        data: `@import "~@someRepo/theme-ctms/styles/publicVariables.scss";`,
                        includePaths: [__dirname, '/src']
                    }
                }
            ]
        },
        {
            test: /\.(woff|woff2|eot|ttf|otf)$/,
            loader: 'file-loader?name=fonts/[name].[ext]'
        }
    );
    return config;
};

main.js

module.exports = {
    stories: ['../src/**/*.stories.js'],
    addons: ['@storybook/addon-info', '@storybook/addon-knobs/register']
};

test.config.js

module.exports = {
    moduleNameMapper: {
        'react-syntax-highlighter/dist/esm/(.*)':
            'react-syntax-highlighter/dist/cjs/$1'
    },
    transformIgnorePatterns: [
        'node_modules/(?!react-syntax-highlighter|@storybook)'
    ]
};
4

0 回答 0