解决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 相关文章推荐
JS Range HTML文档/文字内容选中、库及应用介绍
May 12 Javascript
jQuery.Validate验证库的使用介绍
Apr 26 Javascript
字段太多jquey快速清空表单内容方法
Aug 21 Javascript
javascript实现动态模态绑定grid过程代码
Sep 22 Javascript
JavaScript中的substr()方法使用详解
Jun 06 Javascript
轻松学习jQuery插件EasyUI EasyUI创建树形菜单
Nov 30 Javascript
js实现浏览器倒计时跳转页面效果
Aug 12 Javascript
JavaScript如何实现图片懒加载(lazyload) 提高用户体验(增强版)
Nov 30 Javascript
AngularJS2中一种button切换效果的实现方法(二)
Mar 27 Javascript
vue实现登陆登出的实现示例
Sep 15 Javascript
Angular ui-roter 和AngularJS 通过 ocLazyLoad 实现动态(懒)加载模块和依赖
Nov 25 Javascript
jquery的$().each和$.each的区别
Jan 18 jQuery
解决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
zend framework配置操作数据库实例分析
2012/12/06 PHP
简单的php缓存类分享     php缓存机制
2014/01/22 PHP
PHP使用JSON和将json还原成数组
2015/02/12 PHP
php限制ip地址范围的方法
2015/03/31 PHP
php随机显示指定文件夹下图片的方法
2015/07/13 PHP
PHP编程获取图片的主色调的方法【基于Imagick扩展】
2017/08/02 PHP
PHP多线程模拟实现秒杀抢单
2018/02/07 PHP
ThinkPHP5.0框架结合Swoole开发实现WebSocket在线聊天案例详解
2019/04/02 PHP
Yii框架学习笔记之session与cookie简单操作示例
2019/04/30 PHP
laravel 框架结合关联查询 when()用法分析
2019/11/22 PHP
JQuery与iframe交互实现代码
2009/12/24 Javascript
JavaScript/jQuery 表单美化插件小结
2012/02/14 Javascript
浅谈EasyUI中编辑treegrid的方法
2015/03/01 Javascript
浅析Node.js:DNS模块的使用
2016/11/23 Javascript
JS编写函数实现对身份证号码最后一位的验证功能
2016/12/29 Javascript
es6学习笔记之Async函数的使用示例
2017/05/11 Javascript
详解基于webpack搭建react运行环境
2017/06/01 Javascript
简述vue中的config配置
2018/01/23 Javascript
在vue项目中使用element-ui的Upload上传组件的示例
2018/02/08 Javascript
layui中使用jquery控制radio选中事件的示例代码
2018/08/15 jQuery
微信小程序实现banner图轮播效果
2020/06/28 Javascript
微信js-sdk 录音功能的示例代码
2019/11/01 Javascript
VUE实时监听元素距离顶部高度的操作
2020/07/29 Javascript
[01:12:40]DOTA2-DPC中国联赛 正赛 DLG vs XG BO3 第三场 1月25日
2021/03/11 DOTA
全面了解python字符串和字典
2016/07/07 Python
Python实现合并两个列表的方法分析
2018/05/28 Python
Python爬虫:Request Payload和Form Data的简单区别说明
2020/04/30 Python
为什么说python适合写爬虫
2020/06/11 Python
如何创建一个Flask项目并进行简单配置
2020/11/18 Python
html5中地理位置定位api接口开发应用小结
2013/01/04 HTML / CSS
基于zepto的插件之移动端无缝向上滚动并上下触摸滑动实例代码
2016/12/20 HTML / CSS
治庸问责心得体会
2014/09/12 职场文书
部队反四风对照检查材料
2014/09/26 职场文书
支部书记四风问题自我剖析材料
2014/09/29 职场文书
2015年车间管理工作总结
2015/07/23 职场文书
php 原生分页
2021/04/01 PHP