-
-
Notifications
You must be signed in to change notification settings - Fork 2.3k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
SVG Transformation Removes Definitions #8851
Comments
A workaround would be
(as long as you don't have inline styles/actual urls to assets in your SVG) |
Thank you! That workaround helped. |
Worked for me too. Thanks @mischnic |
I have the same problem, but this workaround didn't fix it for me. I'm guessing it's because my SVG is inlined, and not loaded from an external file. Edit: I also tried to extract the SVG into an external file and installing the suggested dependency, but it seems like that dependency only works in React projects, so it doesn't work for me. Edit2: The only workaround I found was using JS to add the element at runtime like |
@mischnic what should we do if we actually have inline SVGs? We're facing the problem that we include (inline) an SVG with |
This issue has been automatically marked as stale because it has not had recent activity. It will be closed in 14 days if no further activity occurs. |
🐛 bug report
I've included an SVG image using the React component syntax:
The SVG has three paths, and one linear gradient defined.
The first path is filled with the linear gradient, and the other paths are solid colors.
🎛 Configuration (.babelrc, package.json, cli command)
.parcelrc
🤔 Expected Behavior
All three paths render, as they do when I open the SVG in the browser by itself.
😯 Current Behavior
Only the last two paths, with solid fill, render. The first path changes its fill property to
fill="url('5f5faccf2b6c5172')"
, but there is no linear gradient definition at all.💁 Possible Solution
Looks like it might be a similar issue to #8125
🔦 Context
We can't use SVG for our logo unless this is fixed.
💻 Code Sample
🌍 Your Environment
The text was updated successfully, but these errors were encountered: