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 应用类库代码
Jun 02 Javascript
js 字符串操作函数
Jul 25 Javascript
javascript 获取select下拉列表值的代码
Sep 07 Javascript
ExtJs之带图片的下拉列表框插件
Mar 04 Javascript
json对象转字符串如何实现
Dec 02 Javascript
iframe父页面获取子页面参数的方法
Feb 21 Javascript
jquery实现红色竖向多级向右展开的导航菜单效果
Aug 31 Javascript
AngularJS应用开发思维之依赖注入3
Aug 19 Javascript
vue3.0 CLI - 2.1 -  component 组件入门教程
Sep 14 Javascript
巧妙运用v-model实现父子组件传值的方法示例
Apr 07 Javascript
Vue的路由及路由钩子函数的实现
Jul 02 Javascript
Vue OpenLayer测距功能的实现
Apr 20 Vue.js
详解三种方式在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
PHPExcel读取EXCEL中的图片并保存到本地的方法
2015/02/14 PHP
PHP7内核之Reference详解
2019/03/14 PHP
用js来定义浏览器中一个左右浮动元素相对于页面主体宽度的位置的函数
2012/01/21 Javascript
event对象获取方法总结在google浏览器下测试
2013/11/03 Javascript
JavaScript中的typeof操作符用法实例
2014/04/05 Javascript
无限树Jquery插件zTree的常用功能特性总结
2014/09/11 Javascript
node.js中的http.createServer方法使用说明
2014/12/14 Javascript
JavaScript中实现map功能代码分享
2015/06/11 Javascript
js实现简单计算器
2015/11/22 Javascript
js仿支付宝填写支付密码效果实现多方框输入密码
2016/03/09 Javascript
js实现页面跳转的几种方法小结
2016/05/16 Javascript
WEB开发之注册页面验证码倒计时代码的实现
2016/12/15 Javascript
BootStrap select2 动态改变值的方法
2017/02/10 Javascript
js oncontextmenu事件使用详解
2017/03/25 Javascript
Vue.js实战之组件之间的数据传递
2017/04/01 Javascript
vue.js内部自定义指令与全局自定义指令的实现详解(利用directive)
2017/07/11 Javascript
React学习之事件绑定的几种方法对比
2017/09/24 Javascript
vue 使用鼠标滚动加载数据的例子
2019/10/31 Javascript
Vue实现PC端靠边悬浮球的代码
2020/05/09 Javascript
微信小程序获取当前时间及星期几的实例代码
2020/09/20 Javascript
nuxt.js写项目时增加错误提示页面操作
2020/11/05 Javascript
python修改注册表终止360进程实例
2014/10/13 Python
Python使用poplib模块和smtplib模块收发电子邮件的教程
2016/07/02 Python
浅析Python中的赋值和深浅拷贝
2017/08/15 Python
python 产生token及token验证的方法
2018/12/26 Python
Python-Seaborn热图绘制的实现方法
2019/07/15 Python
Python for循环与getitem的关系详解
2020/01/02 Python
PyCharm 2020.2下配置Anaconda环境的方法步骤
2020/09/23 Python
python Cartopy的基础使用详解
2020/11/01 Python
HTML5制作3D爱心动画教程 献给女友浪漫的礼物
2014/11/05 HTML / CSS
Carolina工作鞋官网:Carolina Footwear
2019/03/14 全球购物
大学老师推荐信
2014/02/25 职场文书
毕业生求职信
2014/06/10 职场文书
学校政风行风自查自纠报告
2014/10/21 职场文书
2015年行政工作总结范文
2015/04/09 职场文书
Python&Matlab实现灰狼优化算法的示例代码
2022/03/21 Python