Transform SVGs into React components using svgr as vite plugin

npm install --save-dev vite-plugin-svgr

// vite.config.js
import svgr from "vite-plugin-svgr";

export default {
  // ...
  plugins: [svgr()],
};

Then SVG files can be imported as React components:

import Logo from "./logo.svg?react";

If you are using TypeScript, there is also a declaration helper for better type inference:

/// <reference types="vite-plugin-svgr/client" />

References
https://www.npmjs.com/package/vite-plugin-svgr