React using Sprite SVG icons

We use a lot of icons and logos in our web applications and at the end we have a lot of SVG files. But using Sprite, all icons are loaded from one SVG file.

An example of an Sprite file:

To use any icon in React, you need to do this:

import Sprite from "YOUR_ROOT/sprite.svg";
<svg width="24" height="24">
    <use xlinkHref={`${Sprite}#backicon`}/>
</svg>

Here is output:

Note: You can not set your own style for elements inside #Shadow-root !