Storybook config to replace the loader for SVG files

main.js

module.exports = {
  webpackFinal: async config => {
    // Remove 'svg' from the existing regex covering all images
    const svgRule = config.module.rules.find(rule => typeof rule.test.test === 'function' && rule.test.test('.svg'));
    svgRule.test = new RegExp(svgRule.test.source.replace('svg|', ''))

    // Add a new rule for svg files only
    config.module.rules.push({
      test: /\.svg$/,
      use: [
        {
          loader: 'html-loader',
          options: {
            minimize: true
          }
        }
      ]
    });
    
    return config
  },
}