下载element-ui 资源,图标 element-icons.woff,element-icons.ttf 无法解码文件字体

css下载地址: https://unpkg.com/element-ui@2.15.14/lib/theme-chalk/index.css

js下载地址: https://unpkg.com/element-ui@2.15.14/lib/index.js

图标及文字文件下载地址:

element-icons.woff::

​ https://unpkg.com/element-ui@2.15.14/lib/theme-chalk/fonts/element-icons.woff ​

element-icons.ttf:

https://unpkg.com/element-ui@2.15.14/lib/theme-chalk/fonts/element-icons.ttf

访问项目发现icon图标无法现在!

浏览器控制台报错:

Failed to decode downloaded font: http://localhost:8080/demo/css/ui/element/fonts/element-icons.woff

报错原因:Maven构建过程中,默认会对资源文件过滤处理,有些文件内容或字体被Maven处理之后不能正常解析。

解决方式:

在pom.xml文件中添加 maven-resources-plugin 插件

复制代码
<plugin>
    <groupId>org.apache.maven.plugins</groupId>
    <artifactId>maven-resources-plugin</artifactId>
    <version>2.6</version>
    <configuration>
        <nonFilteredFileExtensions>
            <nonFilteredFileExtension>ico</nonFilteredFileExtension>
            <nonFilteredFileExtension>otf</nonFilteredFileExtension>
            <nonFilteredFileExtension>woff</nonFilteredFileExtension>
            <nonFilteredFileExtension>woff2</nonFilteredFileExtension>
            <nonFilteredFileExtension>eot</nonFilteredFileExtension>
            <nonFilteredFileExtension>svg</nonFilteredFileExtension>
            <nonFilteredFileExtension>ttf</nonFilteredFileExtension>
        </nonFilteredFileExtensions>
        <encoding>UTF-8</encoding>
    </configuration>
</plugin>

然后重新构建项目!

相关推荐
TheManba20 分钟前
04. maven 三种项目打包方式 pom、jar、war 的区别(记一次 Spring 项目启动报错)
spring·maven·jar
爬山算法4 小时前
Maven(6)如何使用Maven进行项目构建?
java·maven
Jiaberrr15 小时前
Element UI教程:如何将Radio单选框的圆框改为方框
前端·javascript·vue.js·ui·elementui
CS_GaoMing2 天前
Centos7 JDK 多版本管理与 Maven 构建问题和注意!
java·开发语言·maven·centos7·java多版本
Java探秘者2 天前
Maven下载、安装与环境配置详解:从零开始搭建高效Java开发环境
java·开发语言·数据库·spring boot·spring cloud·maven·idea
晚睡早起₍˄·͈༝·͈˄*₎◞ ̑̑2 天前
JavaWeb(二)
java·数据仓库·hive·hadoop·maven
码农0002 天前
Vue2 + ElementUI + axios + VueRouter入门
前端·javascript·elementui
忙里偷闲的sin2 天前
整理Maven坐标,Spring Boot集成工具依赖版本差异问题
java·spring boot·maven
芝法酱2 天前
芝法酱学习笔记(0.6)——nexus与maven私库
java·maven·nexus
做一个有用的阿吉2 天前
element-ui 通过按钮式触发日期选择器
elementui