Background:
I have a folder of SVG's which is being served by the server-side with express.static('public).
Inside my component, I want to: import SVG from '/public/assets/${filename}.svg'.
The filename is a props being passed into the component.
Problem
I need to do something like this:
Pseudo code!:
const ChildComponent = (props) => {
import MySvg from '/public/assets/${props.filename}.svg'; //This is not working
return(
<MySvg />
);
}
Questions:
When I use an image from the static files I refer to it like this:
<img src="/public/assets/myImg.jpeg" />.
Is it possible to import static files like this?
import myImg from '/public/assets/mySvg.svg'?How can I lazy import the SVG file, when I need to use some props value in order to create the path to the SVG file?