Webpack 5 config for svg imports in .scss

[clieee]

Hello,

I'm having trouble getting the correct config setup for my .svg imports inside .scss files since webpack 5.
What is the config to get this to work? My current setup is as follows:

• installed @svgr/webpack
  next.config.js:

future: {
        webpack5: true
    },

and then:

config.module.rules.push({
            test: /\.svg?$/,
            oneOf: [
                {
                    use: [
                        {
                            loader: '@svgr/webpack',
                            options: {
                                prettier: false,
                                svgo: true,
                                svgoConfig: {
                                    plugins: [{ removeViewBox: false }]
                                },
                                titleProp: true
                            }
                        }
                    ],
                    issuer: {
                        and: [/\.scss$/]
                    }
                }
            ]
        });

But when I build for production I get the following message for a generated .svg uri:

error on line 1 at column 1: Document is empty
Below is a rendering of the page up to the first error.```

Thanks

[styfle]

Hi @clieee

This sounds related to Issue #26130