解决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 相关文章推荐
a标签的href和onclick 的事件的区别介绍
Jul 26 Javascript
javascript中不提供sleep功能如何实现这个功能
May 27 Javascript
js控制输入框获得和失去焦点时状态显示的方法
Jan 30 Javascript
js进行表单验证实例分析
Feb 10 Javascript
JavaScript遍历求解数独问题的主要思路小结
Jun 12 Javascript
原生js实现查询天气小应用
Dec 09 Javascript
通过fastclick源码分析彻底解决tap“点透”
Dec 24 Javascript
layui对工具条进行选择性的显示方法
Sep 19 Javascript
中级前端工程师必须要掌握的27个JavaScript 技巧(干货总结)
Sep 23 Javascript
微信小程序 多行文本显示...+显示更多按钮和收起更多按钮功能
Sep 26 Javascript
Vue+Element实现网页版个人简历系统(推荐)
Dec 31 Javascript
JS实现购物车基本功能
Nov 08 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
PHP 数组和字符串互相转换实现方法
2013/03/26 PHP
thinkphp3.2.2实现生成多张缩略图的方法
2014/12/19 PHP
PHP里的单例类写法实例
2015/06/25 PHP
PHP文件操作实例总结【文件上传、下载、分页】
2018/12/08 PHP
JavaScript 设计模式 富有表现力的Javascript(一)
2010/05/26 Javascript
javascript字母大小写转换的4个函数详解
2014/05/09 Javascript
VS2008中使用JavaScript调用WebServices
2014/12/18 Javascript
javascript获取元素离文档各边距离的方法
2015/02/13 Javascript
js实现简单锁屏功能实例
2015/05/27 Javascript
比较常见的javascript中定义函数的区别
2015/11/09 Javascript
AngularJS模块学习之Anchor Scroll
2016/01/19 Javascript
Jquery UI实现一次拖拽多个选中的元素操作
2020/12/01 Javascript
微信小程序 弹幕功能简单实例
2017/02/14 Javascript
JS实现简单短信验证码界面
2017/08/07 Javascript
详解 vue.js用法和特性
2017/10/15 Javascript
微信小程序实现底部导航
2018/11/05 Javascript
vue中各种通信传值方式总结
2019/02/14 Javascript
JavaScript自动生成 年月范围 选择功能完整示例【基于jQuery插件】
2019/09/03 jQuery
vue实现购物车小案例
2019/09/27 Javascript
node.JS二进制操作模块buffer对象使用方法详解
2020/02/06 Javascript
python实现多张图片拼接成大图
2019/01/15 Python
pygame实现贪吃蛇游戏(上)
2019/10/29 Python
Django生成PDF文档显示网页上以及PDF中文显示乱码的解决方法
2019/12/17 Python
python修改linux中文件(文件夹)的权限属性操作
2020/03/05 Python
Python实现一个优先级队列的方法
2020/07/31 Python
SISLEY希思黎官方旗舰店:享誉全球的奢华植物美容品牌
2018/04/25 全球购物
Kusmi茶美国官网:优质散叶茶和茶包
2019/10/13 全球购物
new修饰符是起什么作用
2015/06/28 面试题
override和overload的区别
2016/03/09 面试题
招聘单位介绍信
2014/01/14 职场文书
主持词开场白
2014/03/17 职场文书
幼儿园保育员责任书
2014/07/22 职场文书
员工年终考核评语
2014/12/31 职场文书
HTML中table表格拆分合并(colspan、rowspan)
2021/04/07 HTML / CSS
每日六道java新手入门面试题,通往自由的道路
2021/06/30 Java/Android
铁拳制作人赞《铁拳7》老头环Mod:制作精良 但别弄了
2022/04/03 其他游戏