search

natemoo-re / astro-icon

Inline and sprite-based SVGs in Astro made easy!
https://astroicon.dev
Other
990 stars 57 forks source link

v1: Failed to import "logo": Unexpected element: <switch> #185

Open mseele opened 5 months ago

mseele commented 5 months ago

What version of astro-icon are you using?

v1.0.2

Astro Info

Astro                    v4.1.0
Node                     v21.5.0
System                   macOS (arm64)
Package Manager          pnpm
Output                   static
Adapter                  none
Integrations             @astrojs/tailwind
                         astro-icon
                         @astrojs/sitemap
                         astro-robots-txt

If this issue only occurs in one browser, which browser is a problem?

No response

Describe the Bug

Since Version 1, loading of our "logo.svg" failed with error

Failed to import "logo": Unexpected element: <switch>

What's the expected result?

Loading the logo.svg should work like in pre 1.0 versions.

Link to Minimal Reproducible Example

https://stackblitz.com/edit/github-j9gyhg?file=src%2Fpages%2Findex.astro

gilmargr commented 5 months ago

I got a similar error.Unexpected element: <text> It seems an error interpreting svg files

natemoo-re commented 5 months ago

This error is caused by our dependency on @iconify/utils. When it loads an icon, it attempts to optimize it, but svgo doesn't support everything.

In this case, I don't think the switch element is doing anything and it could easily be changed to a g? As for <text>, I need to figure out why Iconify throws because it definitely should just ignore it.

gilmargr commented 5 months ago

I ran svgo on the command line using the original SVG file as input and received no output errors. However, the output file produces the same error as the original one.

gnosticdev commented 5 months ago

I had similar issue with and it turns out iconify doesnt allow text bc of how they render differently based on the OS.

https://iconify.design/docs/articles/cleaning-up-icons/validate.html#text-and-fonts

gilmargr commented 5 months ago

It actually makes sense. I transformed the text to path and now it works. Thanks for the tip!