解决vue 项目引入字体图标报错、不显示等问题


Posted in Javascript onSeptember 01, 2018

问题:在项目开发时使用字体图标,发现两个问题;

1、出现报错:

解决vue 项目引入字体图标报错、不显示等问题

解决方法为:把字体引入方式改为绝对路径

解决vue 项目引入字体图标报错、不显示等问题

2、不报错,但是不显示图标字体,出现方框

解决vue 项目引入字体图标报错、不显示等问题

原因可能有两种:

①没在用到的地方引入字体的样式文件②你使用的是后缀名为 .styl 文件

①的解决办法是在用到的地方引入字体的样式文件(全局引入的话需要从app.vue里引入)

解决vue 项目引入字体图标报错、不显示等问题

②这个就是我遇到的问题,浪费了我好几分钟!!!微笑

解决办法是把font.styl改为font.css

解决vue 项目引入字体图标报错、不显示等问题

记得在用到图标的地方引入

解决vue 项目引入字体图标报错、不显示等问题

问题原理后续再写。

以上这篇解决vue 项目引入字体图标报错、不显示等问题就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JS 文件传参及处理技巧分析
May 13 Javascript
推荐 21 款优秀的高性能 Node.js 开发框架
Aug 18 Javascript
jquery ui resize 中border-box的bug修正
Apr 26 Javascript
ECMAScript6函数默认参数
Jun 12 Javascript
JS实现状态栏跑马灯文字效果代码
Oct 24 Javascript
jQuery定义插件的方法
Dec 18 Javascript
jQuery扩展+xml实现表单验证功能的方法
Dec 25 Javascript
JavaScript实现元素滚动条到达一定位置循环追加内容
Dec 28 Javascript
vue-cli创建的项目,配置多页面的实现方法
Mar 15 Javascript
vue项目中公用footer组件底部位置的适配问题
May 10 Javascript
bootstrap-table后端分页功能完整实例
Jun 01 Javascript
字节飞书面试promise.all实现示例
Jun 16 Javascript
解决在vue项目中webpack打包后字体不生效的问题
Sep 01 #Javascript
vuejs 制作背景淡入淡出切换动画的实例
Sep 01 #Javascript
vue解决使用webpack打包后keep-alive不生效的方法
Sep 01 #Javascript
解决vue-router在同一个路由下切换,取不到变化的路由参数问题
Sep 01 #Javascript
JS与jQuery判断文本框还剩多少字符可以输入的方法
Sep 01 #jQuery
vue初始化动画加载的实例
Sep 01 #Javascript
jQuery解析json格式数据示例
Sep 01 #jQuery
You might like
解析PHPExcel使用的常用说明以及把PHPExcel整合进CI框架的介绍
2013/06/24 PHP
codeigniter显示所有脚本执行时间的方法
2015/03/21 PHP
PHP中的数组处理函数实例总结
2016/01/09 PHP
浅析PHP7新功能及语法变化总结
2016/06/17 PHP
PHP查看SSL证书信息的方法
2016/09/22 PHP
Laravel框架源码解析之入口文件原理分析
2020/05/14 PHP
让innerText在firefox火狐和IE浏览器都能用的写法
2011/05/14 Javascript
JavaScript对IE操作的经典代码(推荐)
2014/03/10 Javascript
浅谈Cookie的生命周期问题
2016/08/02 Javascript
在bootstrap中实现轮播图实例代码
2017/06/11 Javascript
node.js 利用流实现读写同步,边读边写的方法
2017/09/11 Javascript
[49:20]VG vs TNC Supermajor小组赛B组败者组决赛 BO3 第二场 6.2
2018/06/03 DOTA
[02:23]1个至宝=115个英雄特效 最“绿”至宝拉比克“魔导师密钥”登场
2018/12/29 DOTA
python模拟enum枚举类型的方法小结
2015/04/30 Python
Python素数检测的方法
2015/05/11 Python
Python部署web开发程序的几种方法
2017/05/05 Python
python实现列表的排序方法分享
2019/07/01 Python
python绘制双Y轴折线图以及单Y轴双变量柱状图的实例
2019/07/08 Python
Python利用scapy实现ARP欺骗的方法
2019/07/23 Python
Python学习笔记之错误和异常及访问错误消息详解
2019/08/08 Python
python爬虫 线程池创建并获取文件代码实例
2019/09/28 Python
Python中url标签使用知识点总结
2020/01/16 Python
关于tensorflow softmax函数用法解析
2020/06/30 Python
python右对齐的实例方法
2020/07/05 Python
Python+Appium实现自动化清理微信僵尸好友的方法
2021/02/04 Python
CSS3制作半透明边框(Facebox)类似渐变
2012/12/09 HTML / CSS
辅导员评语
2014/05/04 职场文书
辞旧迎新演讲稿
2014/09/15 职场文书
有限责任公司股东合作协议书
2014/12/02 职场文书
泰山导游词
2015/02/02 职场文书
2015年学校总务处工作总结
2015/05/19 职场文书
严以律己专题学习研讨会发言材料
2015/11/09 职场文书
sqlserver2017共享功能目录路径不可改的解决方法
2021/04/16 SQL Server
mongodb清除连接和日志的正确方法分享
2021/09/15 MongoDB
Android超详细讲解组件ScrollView的使用
2022/03/31 Java/Android
详细介绍Java中的CyclicBarrier
2022/04/13 Java/Android