解决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 相关文章推荐
各浏览器对link标签onload/onreadystatechange事件支持的差异分析
Apr 27 Javascript
谷歌浏览器不支持showModalDialog模态对话框的解决方法
Sep 22 Javascript
Jquery 实现table样式的设定
Jan 28 Javascript
jQuery关键词说明插件cluetip使用指南
Apr 21 Javascript
JQuery实现样式设置、追加、移除与切换的方法
Jun 11 Javascript
Vue.js双向绑定操作技巧(初级入门)
Dec 27 Javascript
Angular使用Md5加密的解决方法
Sep 16 Javascript
vue 刷新之后 嵌套路由不变 重新渲染页面的方法
Sep 13 Javascript
简单说说angular.json文件的使用
Oct 29 Javascript
js对象属性名驼峰式转下划线的实例代码
Sep 17 Javascript
js实现弹幕墙效果
Dec 10 Javascript
React配置子路由的实现
Jun 03 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
杏林同学录(五)
2006/10/09 PHP
zend api扩展的php对象的autoload工具
2011/04/18 PHP
解决laravel资源加载路径设置的问题
2019/10/14 PHP
Javascript实例教程(19) 使用HoTMetal(1)
2006/12/23 Javascript
jquery Firefox3.5中操作select的问题
2009/07/10 Javascript
jquery下为Event handler传递动态参数的代码
2011/01/06 Javascript
深入领悟JavaScript中的面向对象
2013/11/18 Javascript
jquery实现人性化的有选择性禁用鼠标右键
2014/06/30 Javascript
JavaScript节点及列表操作实例小结
2015/08/05 Javascript
jquery实现图片预加载
2015/12/25 Javascript
jQuery+正则+文本框只能输入数字的实现方法
2016/10/07 Javascript
使用jquery如何获取时间
2016/10/13 Javascript
jQuey将序列化对象在前台显示地实现代码(方法总结)
2016/12/13 Javascript
JavaScript实现垂直滚动条效果
2017/01/18 Javascript
three.js实现围绕某物体旋转
2017/01/25 Javascript
layui 关闭open弹出框 刷新table表格页面的方法
2019/09/16 Javascript
js页面加载后执行的几种方式小结
2020/01/30 Javascript
JavaScript如何实现防止重复的网络请求的示例
2021/01/28 Javascript
Python 异常处理实例详解
2014/03/12 Python
跟老齐学Python之有容乃大的list(3)
2014/09/15 Python
Python os模块介绍
2014/11/30 Python
Python中属性和描述符的正确使用
2016/08/23 Python
Python文件操作之合并文本文件内容示例代码
2017/09/19 Python
Python获取指定文件夹下的文件名的方法
2018/02/06 Python
两个元祖T1=('a', 'b'),T2=('c', 'd')使用匿名函数将其转变成[{'a': 'c'},{'b': 'd'}]的几种方法
2019/03/05 Python
python图像和办公文档处理总结
2019/05/28 Python
python 项目目录结构设置
2020/02/14 Python
利用python实现逐步回归
2020/02/24 Python
Windows下Anaconda和PyCharm的安装与使用详解
2020/04/23 Python
python Paramiko使用示例
2020/09/21 Python
Python爬虫后获取重定向url的两种方法
2021/01/19 Python
Jimmy Choo美国官网:周仰杰鞋子品牌
2018/06/08 全球购物
加拿大著名的奢侈品购物网站:SSENSE(支持中文)
2020/06/25 全球购物
内衣营销方案
2014/03/15 职场文书
12.4法制宣传日标语
2014/10/08 职场文书
清明节随笔
2015/08/15 职场文书