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


Posted in Javascript onSeptember 01, 2018

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

1、出现报错:

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

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

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

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

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

原因可能有两种:

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

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

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

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

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

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

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

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

问题原理后续再写。

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

Javascript 相关文章推荐
Whatever:hover 无需javascript让IE支持丰富伪类
Jun 29 Javascript
JavaScript中使用arguments获得函数传参个数实例
Aug 27 Javascript
jQuery Validate表单验证深入学习
Dec 18 Javascript
jquery实现全选和全不选功能效果的实现代码【推荐】
May 05 Javascript
JS从一组数据中找到指定的单条数据的方法
Jun 02 Javascript
AngularJS基础 ng-repeat 指令简单示例
Aug 03 Javascript
js实现自动轮换选项卡
Jan 13 Javascript
JavaScript函数柯里化原理与用法分析
Mar 31 Javascript
Vue实现数字输入框中分割手机号码的示例
Oct 10 Javascript
Vue父子组件之间的通信实例详解
Sep 28 Javascript
Vue CLI项目 axios模块前后端交互的使用(类似ajax提交)
Sep 01 Javascript
vue图片裁剪插件vue-cropper使用方法详解
Dec 16 Vue.js
解决在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
基于Jquery与WebMethod投票功能实现代码
2011/01/19 Javascript
js播放wav文件(源码)
2013/04/22 Javascript
jQuery控制TR显示隐藏的几种方法
2014/06/18 Javascript
jquery中map函数遍历数组用法实例
2015/05/18 Javascript
js动态生成form 并用ajax方式提交的实现方法
2016/09/09 Javascript
详解vue嵌套路由-query传递参数
2017/05/23 Javascript
在Vant的基础上实现添加表单验证框架的方法示例
2018/12/05 Javascript
koa-router路由参数和前端路由的结合详解
2019/05/19 Javascript
微信小程序HTTP接口请求封装代码实例
2019/09/05 Javascript
Vant Weapp组件踩坑:picker的初始赋值解决
2020/11/12 Javascript
[10:28]2018DOTA2国际邀请赛寻真——VGJ.S寻梦之路
2018/08/15 DOTA
Python使用Socket(Https)Post登录百度的实现代码
2012/05/18 Python
Python类的定义、继承及类对象使用方法简明教程
2015/05/08 Python
利用Python进行异常值分析实例代码
2017/12/07 Python
Python 等分切分数据及规则命名的实例代码
2019/08/16 Python
PyTorch: 梯度下降及反向传播的实例详解
2019/08/20 Python
Python上下文管理器全实例详解
2019/11/12 Python
浅谈TensorFlow中读取图像数据的三种方式
2020/06/30 Python
html5使用canvas画空心圆与实心圆
2014/12/15 HTML / CSS
Wiggle中国:英国骑行、跑步、游泳 & 铁三运动装备专卖网店
2016/08/02 全球购物
梅西酒窖:Macy’s Wine Cellar
2018/01/07 全球购物
百思买加拿大:Best Buy Canada
2018/03/20 全球购物
远东集团网络工程师面试题
2014/10/20 面试题
写clone()方法时,通常都有一行代码,是什么?
2012/10/31 面试题
财产公证书格式
2014/04/10 职场文书
第一批党的群众路线教育实践活动总结报告
2014/07/03 职场文书
幼儿园教师师德师风演讲稿:我自豪我是一名幼师
2014/09/10 职场文书
劳动争议和解协议书范本
2014/11/20 职场文书
任命书怎么写
2015/03/02 职场文书
2015秋季开学典礼主持词
2015/07/16 职场文书
团结主题班会
2015/08/13 职场文书
观看《筑梦中国》纪录片心得体会
2016/01/18 职场文书
html实现随机点名器的示例代码
2021/04/02 Javascript
pytorch 如何使用amp进行混合精度训练
2021/05/24 Python
如何正确理解python装饰器
2021/06/15 Python
Python四款GUI图形界面库介绍
2022/06/05 Python