svgastrojs

Import SVG file in Astro and use it without the <img /> tag

Is there a way to use and SVG file in an Astro file directly without using the <img /> tag. I want something like this:

import Logo from "./logo.svg"

and then use it like this:

<Logo />

I tried that doing it like that but it didn't work.

Solution

  • You can change the import to add ?raw after the file extension. Then, use <Fragment set:html={Logo} /> to inline the css. See: this post and the Astro docs