使用 @svgr/webpack 加载 SVG 时如何保留 ids？

Question

我正在使用@svgr/webpack将 SVG 文件加载到 React 中，工作正常，但它会删除元素的 id。
为了保留ID，我cleanIDs在SVGO配置文件中看到了这个选项，我将其设置为false，但没有效果。
我怎样才能保留我的身份证？

以下是我在 webpack 中配置加载器的方法：

{
  test: /\.svg$/,
  use: [
    {
      loader: "@svgr/webpack",
      options: {
        cleanIDs: false,
      },
    },
  ],
},

我也尝试过：

• 完全禁用 SVGO，但无法加载 SVG 文件
• 使用 cleanupIDs 选项，但 id 仍被删除

Answer 1

这个配置对我有用@svgr/webpack@5.5.0：

use: [
  {
    loader: "@svgr/webpack",
    options: {
      svgoConfig: {
        plugins: [
          {
            cleanupIDs: false
          }
        ]
      }
    }
  }
]

一些帮助我解决这个问题的链接：

• svgo webpack 示例
• svgo 配置选项