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 相关文章推荐
jquery 1.4.2发布!主要是性能与API
Feb 25 Javascript
node.js中的console.trace方法使用说明
Dec 09 Javascript
js获取当前时间显示在页面上并每秒刷新
Dec 24 Javascript
jQuery中ajax的post()方法用法实例
Dec 26 Javascript
javascript常用的方法分享
Jul 01 Javascript
JS中with的替代方法与String中的正则方法详解
Dec 23 Javascript
vue仿淘宝订单状态的tab切换效果
Jun 23 Javascript
js最简单的双向绑定实例讲解
Jan 02 Javascript
微信小程序实现指定显示行数多余文字去掉用省略号代替
Jul 25 Javascript
解决IE11 vue +webpack 项目中数据更新后页面没有刷新的问题
Sep 25 Javascript
小试SVG之新手小白入门教程
Jan 08 Javascript
微信小程序实现简单的select下拉框
Nov 23 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
javascript iframe编程相关代码
2009/12/28 Javascript
ExtJs设置GridPanel表格文本垂直居中示例
2013/07/15 Javascript
让复选框只能选择一项的方法
2013/10/08 Javascript
Javascript学习笔记之 函数篇(一) : 函数声明和函数表达式
2014/06/24 Javascript
javascript数组输出的两种方式
2015/01/13 Javascript
JS实现固定在右下角可展开收缩DIV层的方法
2015/02/13 Javascript
JavaScript模拟重力状态下抛物运动的方法
2015/03/03 Javascript
JavaScript中的立即执行函数表达式介绍
2015/03/15 Javascript
JavaScript的9种继承实现方式归纳
2015/05/18 Javascript
JavaScript判断数组是否包含指定元素的方法
2015/07/01 Javascript
jQuery数据类型小结(14个)
2016/01/08 Javascript
即将发布的jQuery 3 有哪些新特性
2016/04/14 Javascript
webpack学习--webpack经典7分钟入门教程
2017/06/28 Javascript
jQuery 查找元素操作实例小结
2019/10/02 jQuery
vue Treeselect下拉树只能选择第N级元素实现代码
2020/08/31 Javascript
Python判断变量是否已经定义的方法
2014/08/18 Python
浅析Python基础-流程控制
2016/03/18 Python
利用Python开发微信支付的注意事项
2016/08/19 Python
非递归的输出1-N的全排列实例(推荐)
2017/04/11 Python
python实现AES和RSA加解密的方法
2019/03/28 Python
Python中Numpy mat的使用详解
2019/05/24 Python
Python 分享10个PyCharm技巧
2019/07/13 Python
在Python中使用filter去除列表中值为假及空字符串的例子
2019/11/18 Python
Python变量、数据类型、数据类型转换相关函数用法实例详解
2020/01/09 Python
详解Pytorch显存动态分配规律探索
2020/11/17 Python
HTML5 CSS3打造相册效果附源码下载
2014/06/16 HTML / CSS
国际旅客访问北美最大的汽车租赁提供商:Alamo Rent A Car
2018/06/13 全球购物
施华洛世奇意大利官网:SWAROVSKI意大利
2018/07/23 全球购物
医院竞聘演讲稿
2014/05/16 职场文书
仓管员岗位职责
2015/02/03 职场文书
讲文明倡议书
2015/04/29 职场文书
法院执行局工作总结
2015/08/11 职场文书
文明和谐家庭事迹材料(2016精选版)
2016/02/29 职场文书
四年级作文之说明文作文
2019/10/14 职场文书
vue/cli 配置动态代理无需重启服务的方法
2022/05/20 Vue.js
vue实现input输入模糊查询的三种方式
2022/08/14 Vue.js