the svg in the package will be parsed into a path

[Hsirius]

What's happening

Failed to execute 'createElement' on 'Document': The tag name provided ('/static/media/info.328d871ddbc592dd0cde4c40f0919bfa.svg') is not a valid name

What should happen

the svg in the package should be ReactComponent

To reproduce (list the steps to reproduce this behavior)

CRACO version 7.1.0

CRACO config

module.exports = {
    eslint: {
        enable: false
    },
    babel: {
        plugins: [
            ['import', { libraryName: 'acud', style: true, libraryDirectory: 'lib' }, 'acud'],
            ['@babel/plugin-proposal-decorators', { legacy: true }]
        ],
        presets: [
            '@babel/typescript'
        ]
    },
    devServer: {
        host: host,
        port: 8896,
        https: true,
        headers: {
            'Access-Control-Allow-Origin': '*'
        },
        proxy: {
            '/api': {
                target: URL,
                secure: false,
                changeOrigin: true,
                pathRewrite: {
                    '^/api': '/api'
                }
            },
        }
    },
    plugins: [
        {
            plugin: cracoLess,
            options: {
                lessLoaderOptions: {
                    lessOptions: {
                        modifyVars: { '@primary-color': '#1890ff' },
                        javascriptEnabled: true,
                    },
                },
            },
        }
    ],
    webpack: {
        resolve: {
            extensions: ['.js', '.jsx', '.json', '.ts', '.tsx', '.d.ts'],
        },
        module: {
            rules: [
                {
                    test: /\.(js|jsx|ts|tsx)$/,
                    exclude: /node_modules/,
                    use: {
                        loader: 'babel-loader',
                    },
                },
            ],
        },
        alias: {
            '@': resolve('src'),
        },
        configure: (webpackConfig, { env, paths }) => {
            paths.appBuild = 'output';
            webpackConfig.module.rules.push(
                {
                    test: /\.svg$/,
                    include: /node_modules/,
                    use: ['@svgr/webpack']
                }
            );
            webpackConfig.output.path = path.resolve(__dirname, 'output');
            webpackConfig.output.publicPath = '/';
            webpackConfig.output.filename = 'static/js/[name].js';
            webpackConfig.output.library = 'gaiadbMain';
            webpackConfig.output.libraryTarget = 'amd';
            webpackConfig.plugins = [
                ...webpackConfig.plugins.filter(item => {
                    if (item.options) {
                        return !item.options.hasOwnProperty('ignoreOrder');
                    }
                    return true;
                }),
                new MiniCssExtractPlugin({
                    filename: 'static/css/[name].css',
                    ignoreOrder: false,
                    experimentalUseImportModule: undefined,
                    runtime: true,
                    // chunkFilename: 'static/css/[name].[contenthash:8].chunk.css'
                }),
            ];
            return webpackConfig;
        }
    },
};

package.json

"@craco/craco": "^7.1.0",
"react": "^17.0.2",
"react-dom": "^17.0.2",
 "react-scripts": "5.0.1",
"@svgr/webpack": "^8.1.0",

Additional information (anything else that could be useful for us to help you solve your problem)