I’m facing a problem of SVG icon not showing on the Netlify build but showing properly on local build.
This icon is from bootstrap-5.0.1 navigation bar, only happened after upgrading the bootstrap package from 5.0.0-beta2 to 5.0.1. I know it’s maybe not a Netlify issue, it also happened using
gatsby build, but I think I might get some ideas in this forum.
I presume there is something wrong with the SVG, because the local and production builds show different SVG url (same bootstrap module) when inspecting the website.
Here’s what local build shows: (icon shows properly)
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%280, 0, 0, 0.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
Here’s what production build shows: (icon is not showing)
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 30 30'%3E%3Cpath stroke='rgba(0, 0, 0, 0.55)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E")
I’m very new to coding so these are all the clues I can find. Any helps or tips would be appreciated!