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

You can directly use .svg extension with img tag if the image is remotely hosted.

ReactDOM.render(
  ,
  document.getElementById('root')
);

Here is the fiddle: http://codepen.io/srinivasdamam-1471688843/pen/ZLNYdy?editors=0110

Note: If you are using any web app bundlers (like Webpack) you need to have related file loader.