本文摘自PHP中文网，作者藏色散人，侵删。

vue引入字体css报错的解决办法：1、在用到的地方引入字体的样式文件；2、把“font.styl”改为“font.css”；3、把存放字体的font文件夹移动到和src平级的static文件夹中。

本教程操作环境：windows7系统、vue2版，该方法适用于所有品牌电脑。

推荐：《vue教程》

Vue2.x中利用@font-size引入字体图标报错的解决办法

利用 vue-cli 搭建的项目平台

利用stylus写的css样式

有 css-loader 依赖包x

下图是 webpack.base.conf.js 关于字体文件的配置

有人这里会有重复的字体文件的配置，删除一项即可

出现的问题：引入字体图标出现问题

1.报错

将字体引入的相对路径改成绝对路径
相对路径

绝对路径

2.不报错，但是出现的字体图标是小方框

有警告信息：

小方块：

阅读剩余部分

相关阅读 >>

vue路由守卫哪几种?

vue+webpack2实现路由懒加载的方法介绍

vue和react是什么框架？

详解vue中的无渲染行为插槽

js proxy 的优势以及使用场景

vue中如何分离css

vue bootstrap区别

10个关于路由vue-router的vuejs面试题（含答案解析）

react和vue的区别及优缺点是什么

vue中computed和watch的用法及区别

更多相关阅读请进入《vue》频道 >>

书籍

Vue.js 设计与实现 基于Vue.js 3 深入解析Vue.js 设计细节

￥83.86元   人民邮电出版社

本书对 Vue.js 3 技术细节的分析非常可靠，对于需要深入理解 Vue.js 3 的用户会有很大的帮助。——尤雨溪，Vue.js作者

转载请注明出处：木庄网络博客 » 如何解决vue 引入字体css报错问题