How to display svg icons(.svg files) in UI using React Component?

Question

I have seen lot libraries for svg on react but none gave me how to import a .svg in the react component , I have seen code which talk about bring the svg code in to react ra

Answer 1

if you have .svg or an image locally. first you have to install the loader needed for svg and file-loader for images. Then you have to import your icon or image first for example:

import logo from './logos/myLogo.svg' ;
import image from './images/myimage.png';

const temp = (
     

         
         
     
);

ReactDOM.render(temp,document.getElementByID("app"));

Happy Coding :")

resources from react website and worked for me after many searches: https://create-react-app.dev/docs/adding-images-fonts-and-files/