Getting undefined when importing svg as ReactComponent in create-react-app project

Question

I\'m getting following error when trying to load svg as ReactComponent.

Element type is invalid: expected a string (for built-in components) or a class/fu

Answer 1

TLDR: import MySvg from "MySvg.svg" then

To import an SVG: import MySvg from "MySvg.svg" which will save the path as a string inside MySvg.

To render it, use an img tag as in standard HTML, since MySvg is actually a path:

The reason you get undefined is that you are destructuring a string.