SVGR: VS-Code Edition
This extension is a port of the SVGR library for use in Visual Studio Code. It allow's you to convert SVG's to JSX syntax for use in React JS (and React Native) using a variety of methods.
You can convert SVG to JSX using any of the following methods:
Paste SVG into empty .js file
You can automatically convert an SVG to JSX by pasting the SVG code into an empty .js or .ts file:
Convert SVG in .js file using Code Lens
When you have an inline SVG in an React file a series of links will appear above the SVG code. You can convert the SVG to the following:
Here is what Code Lens looks like:
You can convert your SVG to an component in the same file like so:
Using right click to convert SVG file to Component file.
You can convert a .svg file to a React component file by right clicking on it and clicking on the button labeled: "SVGR: Convert SVG file to React component"