Inline SVG to React by Vite

[ai]

I am taking about files like https://github.com/mikhin/vite-figma/blob/main/src/ui/components/Lurkers.tsx

Having SVG in JSX files leads to a few problems:

1. You can’t view SVG files in system image viewer
2. You can’t edit SVG files in GUI editor
3. You can’t use scripts like svgo on these SVG files

Vite has a few tools to convert SVG file to React component automatically https://dev.to/cassidoo/importing-svg-files-as-react-components-with-vite-l3n

[ai]

And you can use dynamic styles like fill by using CSS Custom Properties