SVG Sprite文件可以从Nginx正常加载,但不能用于Tomcat,而是从另一个端口(模拟CDN)提供服务]]

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了SVG Sprite文件可以从Nginx正常加载,但不能用于Tomcat,而是从另一个端口(模拟CDN)提供服务]]相关的知识,希望对你有一定的参考价值。

我将嵌入html的svg更改为Webpack提供的文件位置。

<svg class="rsvg largeTileBlock__itemDataIconSvg inlineBlock relative">
   <use xlink:href="http://localhost:9001/dist/img/app/icons.svg#rsvg__arrows--trendDown"
        href="http://localhost:9001/dist/img/app/icons.svg#rsvg__arrows--trendDown"
   />
</svg>

这在nginx页面中有效。但这在我的Tomcat页面中不起作用,我正在努力。

可能出什么事了? (箭头应在第二张图片的圆圈中加载)

enter image description here

enter image description here

我将嵌入HTML的svg更改为Webpack提供的文件位置。

答案

好吧,因为它有一个我没有注意到的本地href,因此可以正常工作。

以上是关于SVG Sprite文件可以从Nginx正常加载,但不能用于Tomcat,而是从另一个端口(模拟CDN)提供服务]]的主要内容,如果未能解决你的问题,请参考以下文章

Vue项目中svg图标不能正常显示

有啥方法可以从 CSS 中使用 SVG Sprite?

自制按钮图标的两种方法: image sprite和svg字体文件

Safari中的SVG Fragment Sprite + CSS背景图像

如何在vue项目中使用svg图标

Vite中使用 svg-sprite-loader