Vue elementui字体图标显示问题解决方案


Posted in Javascript onAugust 18, 2020

问题如下

Vue elementui字体图标显示问题解决方案

在build/utils.js下找到

if (options.extract) {
  return ExtractTextPlugin.extract({
   use: loaders,
   fallback: 'vue-style-loader',
   publicPath: '../../'
  })
 } else {
  return ['vue-style-loader'].concat(loaders)
 }

加上

publicPath: '../../'

 

运行项目还是不行 ,Failed to decode downloaded font: http://192.168.11.110:8081/dist/static/font 路径也是对的

网上搜了很多,大部分说是后台经过maven的filter,会破坏font文件的二进制文件格式,导致前台解析出错

但是我的是运行在本地环境下,还没有进行打包部署

解决方式:

在maven文件的pom文件的build标签加入下面的

<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>

重启项目,这样应该就可以了

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JavaScript Object的extend是一个常用的功能
Dec 02 Javascript
Extjs入门之动态加载树代码
Apr 09 Javascript
jQuery dialog 异步调用ashx,webservice数据的代码
Aug 03 Javascript
jQuery侧边栏随窗口滚动实现方法
Mar 04 Javascript
struts2+jquery+json实现异步加载数据(自写)
Jun 24 Javascript
jquery动态加载js/css文件方法(自写小函数)
Oct 11 Javascript
JavaScript中的DSL元编程介绍
Mar 15 Javascript
一分钟理解js闭包
May 04 Javascript
JavaScript数据结构链表知识详解
Nov 21 Javascript
微信小程序 按钮滑动的实现方法
Sep 27 Javascript
javascript少儿编程关于返回值的函数内容
May 27 Javascript
vue中使用百度脑图kityminder-core二次开发的实现
Sep 26 Javascript
详解三种方式在React中解决绑定this的作用域问题并传参
Aug 18 #Javascript
javascript实现移动端上传图片功能
Aug 18 #Javascript
八种Vue组件间通讯方式合集(推荐)
Aug 18 #Javascript
小程序实现上传视频功能
Aug 18 #Javascript
如何在selenium中使用js实现定位
Aug 18 #Javascript
vue实现移动端input上传视频、音频
Aug 18 #Javascript
React冒泡和阻止冒泡的应用详解
Aug 18 #Javascript
You might like
PHP自带ZIP压缩、解压缩类ZipArchiv使用指南
2015/03/03 PHP
php如何控制用户对图片的访问 PHP禁止图片盗链
2016/03/25 PHP
php解决和避免form表单重复提交的几种方法
2016/08/31 PHP
javascript 一些用法小结
2009/09/11 Javascript
JQuery 遮罩层实现(mask)实现代码
2010/01/09 Javascript
javascript 解决表单仍然提交即使监听处理函数返回false
2010/03/14 Javascript
一个简单的JavaScript数据缓存系统实现代码
2010/10/24 Javascript
通过jquery还原含有rowspan、colspan的table的实现方法
2012/02/10 Javascript
解析JavaScript中instanceof对于不同的构造器或许都返回true
2013/12/03 Javascript
javascript对JSON数据排序的3个例子
2014/04/12 Javascript
js微信扫描二维码登录网站技术原理
2016/12/01 Javascript
javascript实现秒表计时器的制作方法
2017/02/16 Javascript
JavaScript下拉菜单功能实例代码
2017/03/01 Javascript
在vue-cli脚手架中配置一个vue-router前端路由
2017/07/03 Javascript
Vue内容分发slot(全面解析)
2017/08/19 Javascript
nginx配置React静态页面的方法教程
2017/11/03 Javascript
原生js实现移动端触摸轮播的示例代码
2017/12/22 Javascript
详解在React中跨组件分发状态的三种方法
2018/08/09 Javascript
Angular设置别名alias的方法
2018/11/08 Javascript
vue车牌号校验和银行校验实战
2019/01/23 Javascript
BootstrapValidator验证用户名已存在(ajax)
2019/11/08 Javascript
JavaScript实现省份城市的三级联动
2020/02/11 Javascript
javascript 数组精简技巧小结
2020/02/26 Javascript
python实现基于两张图片生成圆角图标效果的方法
2015/03/26 Python
Python的MongoDB模块PyMongo操作方法集锦
2016/01/05 Python
Python 3.7新功能之dataclass装饰器详解
2018/04/21 Python
python global关键字的用法详解
2019/09/05 Python
Python搭建HTTP服务过程图解
2019/12/14 Python
Scrapy实现模拟登录的示例代码
2021/02/21 Python
2014年应届大学生毕业自我鉴定
2014/01/31 职场文书
电子专业求职信
2014/06/19 职场文书
2014购房个人委托书范本
2014/10/12 职场文书
白鹤梁导游词
2015/02/06 职场文书
一文搞懂python异常处理、模块与包
2021/06/26 Python
Python中如何处理常见报错
2022/01/18 Python
css3带你实现3D转换效果
2022/02/24 HTML / CSS