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 判断浏览器类型及版本
Feb 21 Javascript
javascript onmouseout 解决办法
Jul 17 Javascript
减少访问DOM的次数提升javascript性能
Feb 24 Javascript
JS获得图片alt信息的方法
Apr 01 Javascript
功能强大的Bootstrap组件(结合js)
Aug 03 Javascript
微信小程序 video组件详解
Oct 25 Javascript
jQuery实现模拟flash头像裁切上传功能示例
Dec 11 Javascript
jQuery实现圣诞节礼物动画案例解析
Dec 25 Javascript
使用BootStrap实现表格隔行变色及hover变色并在需要时出现滚动条
Jan 04 Javascript
JS Select下拉框(支持输入模糊查询)
Feb 04 Javascript
jQuery层级选择器_动力节点节点Java学院整理
Jul 04 jQuery
AngularJS遍历获取数组元素的方法示例
Nov 11 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
WINDOWS服务器安装多套PHP的另类解决方案
2006/10/09 PHP
php实现encode64编码类实例
2015/03/24 PHP
PHP 实现重载
2021/03/09 PHP
动态加载js文件 document.createElement
2006/10/14 Javascript
js控制滚动条缓慢滚动到顶部实现代码
2013/03/20 Javascript
JavaScript获得指定对象大小的方法
2015/07/01 Javascript
Vue2路由动画效果的实现代码
2017/07/10 Javascript
JavaScript中的FileReader图片预览上传功能实现代码
2017/07/24 Javascript
ionic3+Angular4实现接口请求及本地json文件读取示例
2017/10/11 Javascript
vue.js开发实现全局调用的MessageBox组件实例代码
2017/11/22 Javascript
AngularJS实现的锚点楼层跳转功能示例
2018/01/02 Javascript
Vue使用高德地图搭建实时公交应用功能(地图 + 附近站点+线路详情 + 输入提示+换乘详情)
2018/05/16 Javascript
用Fundebug插件记录网络请求异常的方法
2019/02/21 Javascript
react项目如何使用iconfont的方法步骤
2019/03/13 Javascript
浅析vue插槽和作用域插槽的理解
2019/04/22 Javascript
jquery 键盘事件 keypress() keydown() keyup()用法总结
2019/10/23 jQuery
vuex刷新后数据丢失的解决方法
2020/10/18 Javascript
[01:26]DOTA2荣耀之路2:iG,China
2018/05/24 DOTA
Python map和reduce函数用法示例
2015/02/26 Python
Python实现可设置持续运行时间、线程数及时间间隔的多线程异步post请求功能
2018/01/11 Python
PyQt5每天必学之进度条效果
2018/04/19 Python
python 动态迁移solr数据过程解析
2019/09/04 Python
python抓取多种类型的页面方法实例
2019/11/20 Python
在win64上使用bypy进行百度网盘文件上传功能
2020/01/02 Python
使用tensorflow DataSet实现高效加载变长文本输入
2020/01/20 Python
Python txt文件常用读写操作代码实例
2020/08/03 Python
CSS3实现类似翻书效果的过渡动画的示例代码
2019/09/06 HTML / CSS
CSS3 绘制BMW logo实的现代码
2013/04/25 HTML / CSS
股东协议书范本
2014/04/14 职场文书
法人代表任命书范本
2014/06/05 职场文书
个人买房协议书范本
2014/10/06 职场文书
田径运动会通讯稿
2015/07/18 职场文书
2015党建工作简报
2015/07/21 职场文书
车间班组长竞聘书
2015/09/15 职场文书
2015年终个人政治思想工作总结
2015/11/24 职场文书
《詹天佑》教学反思
2016/02/20 职场文书