解决vue项目使用font-awesome,build后路径的问题


Posted in Javascript onSeptember 01, 2018

问题:

项目在本地run情况下显示正常,在build后font-awesome的css文件依赖的几个图标文件引用路径报错。

解决vue项目使用font-awesome,build后路径的问题

在webpack.base.conf.js中关于几个文件的配置如下:

{
 test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/,
 loader: 'url-loader',
 options: {
  limit: 10000,
  name: utils.assetsPath('fonts/[name].[hash:7].[ext]')
  }
}

解决:

通过和网上其他大神的配置对比上发现,有些webpack.base.conf.js的配置如下:

{
 test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/,
 loader: 'url-loader'
}

将配置中option注释掉即可解决路径问题。

后续:

这个方式是个治标的方式,不是问题的关键,关键应该在脚手架的其他配置上。

以上这篇解决vue项目使用font-awesome,build后路径的问题就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
重定向实现代码
Nov 20 Javascript
Javascript select控件操作大全(新增、修改、删除、选中、清空、判断存在等)
Dec 19 Javascript
JQuery之拖拽插件实现代码
Apr 14 Javascript
jquery 实现checkbox全选,反选,全不选等功能代码(奇数)
Oct 24 Javascript
批量实现面向对象的实例代码
Jul 01 Javascript
jquery实现checkbox 全选/全不选的通用写法
Feb 22 Javascript
jQuery操作元素css样式的三种方法
Jun 04 Javascript
Javascript数组操作函数总结
Feb 05 Javascript
Vue.js绑定HTML class数组语法错误的原因分析
Oct 19 Javascript
jquery图片放大镜效果
Jun 23 jQuery
JavaScript中AOP的实现与应用
May 06 Javascript
js实现简单掷骰子小游戏
Oct 24 Javascript
解决vue-cli项目webpack打包后iconfont文件路径的问题
Sep 01 #Javascript
解决vue 项目引入字体图标报错、不显示等问题
Sep 01 #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
You might like
初学者入门:细述PHP4的核心Zend
2006/09/05 PHP
PHP strtotime函数详解
2009/12/18 PHP
thinkphp视图模型查询提示ERR: 1146:Table 'db.pr_order_view' doesn't exist的解决方法
2014/10/30 PHP
隐性调用php程序的方法
2015/06/13 PHP
yii2.0整合阿里云oss上传单个文件的示例
2017/09/19 PHP
php变量与字符串的增删改查操作示例
2020/05/07 PHP
Prototype源码浅析 String部分(四)之补充
2012/01/16 Javascript
js拦截alert对话框另类应用
2013/01/16 Javascript
js解析与序列化json数据(三)json的解析探讨
2013/02/01 Javascript
二叉树先序遍历的非递归算法具体实现
2014/01/09 Javascript
JavaScript实现简洁的俄罗斯方块完整实例
2016/03/01 Javascript
vue2笔记 — vue-router路由懒加载的实现
2017/03/03 Javascript
微信小程序wx.previewImage预览图片实例详解
2017/12/07 Javascript
浅谈Vue网络请求之interceptors实际应用
2018/02/28 Javascript
解决axios会发送两次请求,有个OPTIONS请求的问题
2018/10/25 Javascript
JavaScript深入V8引擎以及编写优化代码的5个技巧
2019/06/24 Javascript
Vue中的transition封装组件的实现方法
2019/08/13 Javascript
在vue中使用axios实现post方式获取二进制流下载文件(实例代码)
2019/12/16 Javascript
不依任何赖第三方,单纯用vue实现Tree 树形控件的案例
2020/09/21 Javascript
React中使用Vditor自定义图片详解
2020/12/25 Javascript
[33:17]OG vs VGJ.T 2018国际邀请赛小组赛BO2 第二场 8.18
2018/08/19 DOTA
python实现清屏的方法
2015/04/30 Python
python实现爬虫统计学校BBS男女比例(一)
2015/12/31 Python
python基础练习之几个简单的游戏
2017/11/10 Python
Python实现破解12306图片验证码的方法分析
2017/12/29 Python
Python内置模块hashlib、hmac与uuid用法分析
2018/02/12 Python
python实现DEM数据的阴影生成的方法
2019/07/23 Python
Django之路由层的实现
2019/09/09 Python
pygame实现俄罗斯方块游戏(基础篇1)
2019/10/29 Python
Python3批量创建Crowd用户并分配组
2020/05/20 Python
IE9对HTML5中部分属性不支持的原因分析
2014/10/15 HTML / CSS
财务工作个人求职的自我评价
2013/12/19 职场文书
研发工程师岗位职责
2014/04/28 职场文书
2015年毕业生自我鉴定模板
2014/09/19 职场文书
老干部座谈会主持词
2015/07/03 职场文书
jquery插件实现悬浮的菜单
2021/04/24 jQuery