springboot项目中ttf和woff字体图标页面无法显示

laker 9月前 ⋅ 473 阅读

背景

一个springboot项目,使用的vue+elementUI做的前端页面,页面图标使用的是elementUI中自带的icon图标。刚开始页面图标是正常显示的,不知道什么时候开始,页面图标不显示了。

错误日志

浏览器控制台报错如下:

Failed to decode downloaded font: http://127.0.0.1:8081/ghdx/js/element-ui/fonts/element-icons.woff
index:1 OTS parsing error: incorrect file size in WOFF header
index:1 Failed to decode downloaded font: http://127.0.0.1:8081/ghdx/js/element-ui/fonts/element-icons.ttf
index:1 OTS parsing error: incorrect entrySelector for table directory

解决办法

在网上找到了不下于4种解决方法,只有下面一种可行。 在pom.xml的build节点下添加

<resources>
    <resource>
        <directory>${project.basedir}/src/main/resources</directory>
        <filtering>true</filtering>
        <excludes>
            <exclude>static/js/element-ui/fonts/**</exclude>
        </excludes>
    </resource>
    <resource>
        <directory>${project.basedir}/src/main/resources</directory>
        <filtering>false</filtering>
        <includes>
            <include>static/js/element-ui/fonts/**</include>
        </includes>
    </resource>
</resources>

注意directory${project.basedir}/src/main/resources

其他几种不行的方案

不可行一

这种directory写错了。

<resources>
    <resource>
        <directory>src/main/resources</directory>
        <filtering>true</filtering>
        <excludes>
            <exclude>static/js/element-ui/fonts/**</exclude>
        </excludes>
    </resource>
    <resource>
        <directory>src/main/resources</directory>
        <filtering>false</filtering>
        <includes>
            <include>static/js/element-ui/fonts/**</include>
        </includes>
    </resource>
</resources>

不可行二

excludes写错了。

<resources>
    <resource>
        <directory>${project.basedir}/src/main/resources</directory>
        <filtering>true</filtering>
        <excludes>
            <exclude>**/*.woff</exclude>
            <exclude>**/*.ttf</exclude>
        </excludes>
    </resource>
    <resource>
        <directory>${project.basedir}/src/main/resources</directory>
        <filtering>false</filtering>
        <includes>
            <include>**/*.woff</include>
            <include>**/*.ttf</include>
        </includes>
    </resource>
</resources>

不可行三

反正就是不行

<plugin>
     <groupId>org.apache.maven.plugins</groupId>
     <artifactId>maven-resources-plugin</artifactId>
     <configuration>
          <nonFilteredFileExtensions>
               <nonFilteredFileExtension>ttf</nonFilteredFileExtension>
               <nonFilteredFileExtension>woff</nonFilteredFileExtension>
               <nonFilteredFileExtension>woff2</nonFilteredFileExtension>
          </nonFilteredFileExtensions>
     </configuration>
</plugin>

全部评论: 0

    我有话说: