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 相关文章推荐
解密效果
Jun 23 Javascript
jQuery LigerUI 使用教程表格篇(1)
Jan 18 Javascript
javascript 文件的同步加载与异步加载实现原理
Dec 13 Javascript
元素未显示设置width/height时IE中使用currentStyle获取为auto
May 04 Javascript
解决jQuery ajax请求在IE6中莫名中断的问题
Jun 20 Javascript
jQuery实现页面下拉100像素出现悬浮窗口的方法
Sep 05 Javascript
jQuery事件_动力节点Java学院整理
Jul 05 jQuery
微信小程序checkbox组件使用详解
Jan 31 Javascript
Vue.js 中取得后台原生HTML字符串 原样显示问题的解决方法
Jun 10 Javascript
基于Bootstrap和JQuery实现动态打开和关闭tab页的实例代码
Jun 10 jQuery
JS实现前端动态分页码代码实例
Jun 02 Javascript
js实现表格数据搜索
Aug 09 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 Memcached + APC + 文件缓存封装实现代码
2010/03/11 PHP
php实现excel中rank函数功能的方法
2015/01/20 PHP
Yii框架学习笔记之应用组件操作示例
2019/11/13 PHP
JavaScript 实现模态对话框 源代码大全
2009/05/02 Javascript
JQuery动态给table添加、删除行 改进版
2011/01/19 Javascript
修改jQuery Validation里默认的验证方法
2012/02/14 Javascript
node.js 一个简单的页面输出实现代码
2012/03/07 Javascript
本人自用的global.js库源码分享
2015/02/28 Javascript
JavaScript仿微博输入框效果(案例分析)
2016/12/06 Javascript
基于angular2 的 http服务封装的实例代码
2017/06/29 Javascript
详解在vue-cli项目中使用mockjs(请求数据删除数据)
2017/10/23 Javascript
小程序视频或音频自定义可拖拽进度条的示例代码
2018/09/30 Javascript
微信小程序学习笔记之表单提交与PHP后台数据交互处理图文详解
2019/03/28 Javascript
微信小程序使用字体图标的方法
2019/05/23 Javascript
[19:24]DOTA2客户端使用指南 一分钟快速设置轻松超神
2013/09/24 DOTA
[01:06:32]DOTA2上海特级锦标赛D组资格赛#1 EG VS VP第一局
2016/02/28 DOTA
跟老齐学Python之Python安装
2014/09/12 Python
python实现12306火车票查询器
2017/04/20 Python
浅谈Python traceback的优雅处理
2018/08/31 Python
Linux 修改Python命令的方法示例
2018/12/03 Python
如何更优雅地写python代码
2019/07/02 Python
Pytorch反向求导更新网络参数的方法
2019/08/17 Python
浅析python内置模块collections
2019/11/15 Python
Python 将json序列化后的字符串转换成字典(推荐)
2020/01/06 Python
解决Pycharm中恢复被exclude的项目问题(pycharm source root)
2020/02/14 Python
使用tkinter实现三子棋游戏
2021/02/25 Python
css3实现文字首尾衔接跑马灯的示例代码
2020/10/16 HTML / CSS
迪奥官网:Dior.com
2018/12/04 全球购物
NULL是什么,它是怎么定义的
2015/05/09 面试题
软件测试面试题
2015/10/21 面试题
个人找工作自荐信格式
2013/09/21 职场文书
前台文员岗位职责及工作流程
2013/11/19 职场文书
银行委托书范本
2014/04/04 职场文书
二年级语文下册复习计划
2015/01/19 职场文书
社区扶贫帮困工作总结
2015/05/20 职场文书
python中取整数的几种方法
2021/11/07 Python