This is only possible by utilizing the svgr npm module to render the component

<aside> ⚠️ This only works if you are either using VS Code, or have VSC Insiders aliased to code

</aside>

Generate from an URL

1. First you need to find an SVG on the internet

   (I suggest SVGRepo for finding open-source SVGs)

2. Then right-click and “Copy Image Address”

3. Then you just need to paste the url into this command

   curl "https://www.svgrepo.com/show/414849/education-library-metting.svg" \
   | npx @svgr/cli \
   | code -&
   

4. This should open up into a temporary file inside of VS Code

   Once the generation is completed, it will create the SVG component right there in the editor

5. Done! 🎉

Generate from a file

1. Since we already have the file we don’t need to curl to grab it, and instead we can use cat to output the files contents directly to stdout

cat temp.svg | npx @svgr/cli | code -&

1. This should open up into a temporary file inside of VS Code

   Once the generation is completed, it will create the SVG component right there in the editor

2. Done! 🎉