vite-plugin-svgr
vite-plugin-svgr copied to clipboard
svg ID collision
When using Vite plugin svgr to import multiple SVG files into a single component, I got a collision of the style because the ids how to handle this?
This should be fixed after:
- installing
@svgr/plugin-svgo
-
enabling SVGO in plugins options:
{ svgrOptions: { plugins: ['@svgr/plugin-svgo', '@svgr/plugin-jsx'], } }
However, when using single file multiple times, all components still use one single ID. This is known issue for inline svgs:
- https://github.com/gregberge/svgr/issues/150
- https://github.com/gregberge/svgr/issues/322
See: SVGR Docs > Options > SVGO
My particular case may be fixed with https://github.com/laleksiunas/inline-svg-unique-id