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


Posted in Javascript onSeptember 01, 2018

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

1、出现报错:

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

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

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

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

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

原因可能有两种:

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

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

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

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

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

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

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

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

问题原理后续再写。

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

Javascript 相关文章推荐
JavaScript Accessor实现说明
Dec 06 Javascript
jquery事件机制扩展插件 jquery鼠标右键事件。
Dec 26 Javascript
初识Node.js
Sep 03 Javascript
node.js中的console.trace方法使用说明
Dec 09 Javascript
jQuery和hwSlider实现内容响应式可触控滑动切换效果附源码下载(二)
Jun 22 Javascript
手机端转换rem适应
Apr 01 Javascript
JavaScript中重名的函数与对象示例详析
Sep 28 Javascript
jQuery实现点击下拉框中的值累加到文本框中的方法示例
Oct 28 jQuery
js中事件对象和事件委托的介绍
Jan 21 Javascript
layui自定义工具栏的方法
Sep 19 Javascript
JavaScript实现无限轮播效果
Nov 19 Javascript
使用Vue.js和MJML创建响应式电子邮件
Mar 23 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
探讨PHP JSON中文乱码的解决方法详解
2013/06/06 PHP
解析PHP跨站刷票的实现代码
2013/06/18 PHP
解析thinkphp中的导入文件标签
2013/06/20 PHP
PHP中spl_autoload_register()和__autoload()区别分析
2014/05/10 PHP
thinkphp微信开之安全模式消息加密解密不成功的解决办法
2015/12/02 PHP
YII框架行为behaviors用法示例
2019/04/26 PHP
尽可能写"友好"的"Javascript"代码
2007/01/09 Javascript
JS中处理与当前时间间隔的函数代码
2012/05/23 Javascript
js动画(animate)简单引擎代码示例
2012/12/04 Javascript
js怎么判断flash swf文件是否加载完毕
2014/08/14 Javascript
javascript上下方向键控制表格行选中并高亮显示的方法
2015/02/13 Javascript
javaScript中push函数用法实例分析
2015/06/08 Javascript
JavaScript获取各大浏览器信息图示
2015/11/20 Javascript
jQuery 1.9.1源码分析系列(十五)动画处理之缓动动画核心Tween
2015/12/03 Javascript
JavaScript里 ==与===区别详解
2016/08/16 Javascript
深入理解bootstrap框架之入门准备
2016/10/09 Javascript
用iframe实现不刷新整个页面上传图片的实例
2016/11/18 Javascript
jQuery动态产生select option下拉列表
2017/03/15 Javascript
详解angular element()方法使用
2017/04/08 Javascript
详解nodejs实现本地上传图片并预览功能(express4.0+)
2017/06/28 NodeJs
详解webpack进阶之插件篇
2017/07/06 Javascript
js 事件的传播机制(实例讲解)
2017/07/20 Javascript
vuex 项目结构目录及一些简单配置介绍
2018/04/08 Javascript
解决Vue axios post请求,后台获取不到数据的问题方法
2018/08/11 Javascript
分享8个JavaScript库可更好地处理本地存储
2020/10/12 Javascript
[02:40]DOTA2超级联赛专访430 从小就爱玩对抗性游戏
2013/06/18 DOTA
[05:31]DOTA2英雄梦之声_第08期_莉娜
2014/06/23 DOTA
Python极简代码实现杨辉三角示例代码
2016/11/15 Python
详解CSS3新增的背景属性
2019/12/25 HTML / CSS
html5绘制时钟动画
2014/12/15 HTML / CSS
Expedia爱尔兰:酒店、机票、租车及廉价假期
2017/01/02 全球购物
美发活动策划书
2014/01/14 职场文书
入党积极分子自我鉴定
2014/02/18 职场文书
教师外出学习心得体会
2016/01/18 职场文书
Redis 持久化 RDB 与 AOF的执行过程
2021/11/07 Redis
Go语言基础切片的创建及初始化示例详解
2021/11/17 Golang