一、对图片的处理

安装url-loader

然后再loaderli配置这样会把图片打包成base64格式

{ test: /\.(gif|png|jpg)\??.*$/, loader: 'url-loader' }

如果需要图片格式修改loader配置为

{ test: /\.(gif|png|jpg)\??.*$/, loader: 'url-loader?limit=100&name=resource/[name].[ext]' }

二、对字体的处理

也是用url-loader只需要改变正则变为

{ test: /\.(gif|png|jpg|woff|svg|eot|ttf)\??.*$/, loader: 'url-loader?limit=100&name=resource/[name].[ext]' }

webpack对icon-font图片的处理的更多相关文章

  1. 快速上手制作Icon Font

    现在在提起Icon Font,已经不是什么新鲜的词汇了,网上已经有很多介绍它的文章,并且很多网站也已经将它用到,本篇主要是将制作Icon Font的整个流程整理一下,并且加入了自己在制作中遇到的问题, ...

  2. CSS Sprites+CSS3 Icon Font

    CSS Sprites+CSS3 Icon Font CSS Sprites在国内很多人叫CSS精灵,是一种网页图片应用处理方式.它允许你将一个页面涉及到的所有零星图片都包含到一张大图中去,这样一来, ...

  3. 解决firefox和IE9对icon font字体的跨域访问问题

    何为跨域访问,为什么会有跨域限制?一切还得从浏览器的同源策略说起. 同源策略:是浏览器最核心也是最基本的安全功能,如果缺少了同源策略,则浏览器的正常功能可能会受到影响,可以说Web是构建在同源策略基础 ...

  4. Icon Font浅谈

    这周继续在弄hybird app 的 UI框架的重构,进行到了编写换肤功能的阶段,而在做换肤之前,我想应该先弄一套框架内置的图标. 而图标无非就是两种做法: 1.图片 使用图片很正常,但是有缺陷的. ...

  5. Web 设计新趋势: 使用 SVG 代替 Web Icon Font

    如果你还在使用 Icon Font 作为网页中显示图标的实现方案,那么你可能有点 Out 了. 由于使用 Icon Font 显示图标存在一些缺陷,开发者们一直在致力于探索使用 SVG 作为替代的方法 ...

  6. (转)在iOS中使用icon font

    http://ued.taobao.org/blog/?p=8579 在开发阿里数据iOS版客户端的时候,由于项目进度很紧,项目里的所有图标都是用最平常的背景图片方案来实现.而为了要兼容普通屏与Ret ...

  7. 字体图标 icon font

    Icon font icon font 指的是用字体文件代替图片文件,来展示图标.特殊字体等元素的方法. 应用场景: iconfont的优缺点 大小能够自由地变化 颜色能够自由地改动 加入阴影效果 * ...

  8. 阿里UX矢量图标库–最强大的矢量图标库(Icon font制作力荐工具)

    继前面介绍过ICON-FONT的制作后,找了几个ICON库都是国外的今天偶然发现阿里巴巴的图标矢量库,www.iconfont.cn用了之后感觉很强大,丰富的图标库(集合阿里妈妈&淘宝的图标库 ...

  9. 在iOS中使用icon font

    博文转载至 http://www.cocoachina.com/industry/20131111/7327.html 在开发阿里数据iOS版客户端的时候,由于项目进度很紧,项目里的所有图标都是用最平 ...

  10. 在iOS开发中使用icon font的方法

    http://iconfont.cn/help/iconuse.html 在开发阿里数据iOS版客户端的时候,由于项目进度很紧,项目里的所有图标都是用最平常的背景图片方案来实现.而为了要兼容普通屏与R ...

随机推荐

  1. Gym 100917F Find the Length

    题目链接:http://codeforces.com/gym/100917/problem/F ---------------------------------------------------- ...

  2. 史上最全USB HID开发资料

    史上最全USB HID开发资料 史上最全USB HID开发资料,悉心整理一个月,亲自测试. 涉及STM32 C51 8051F例子都有源码,VC上位机例子以及源码,USB协议,HID协议,USB抓包工 ...

  3. Git007--删除文件

    Git--删除文件 本文来自于:https://www.liaoxuefeng.com/wiki/0013739516305929606dd18361248578c67b8067c8c017b000/ ...

  4. Map2

    map增加和更新: map["key"] = value //如果key还没有,就是增加,如果key存在就是修改 案例演示: func main() { cities := mak ...

  5. P4929 【模板】舞蹈链(DLX)

    题目背景 本题是舞蹈链模板——精确覆盖问题 题目描述 给定一个N行M列的矩阵,矩阵中每个元素要么是1,要么是0 你需要在矩阵中挑选出若干行,使得对于矩阵的每一列j,在你挑选的这些行中,有且仅有一行的第 ...

  6. P1613跑路

    题目描述 小A的工作不仅繁琐,更有苛刻的规定,要求小A每天早上在6:00之前到达公司,否则这个月工资清零.可是小A偏偏又有赖床的坏毛病.于是为了保住自己的工资,小A买了一个十分牛B的空间跑路器,每秒钟 ...

  7. DP50题(转)

    转自https://www.luogu.org/blog/cccx2016/dp50-ti-ti-hao dp50题: poj1014 poj1015 poj1018 poj1036 poj1038 ...

  8. 2019-9-2-win10-uwp-标题栏

    title author date CreateTime categories win10 uwp 标题栏 lindexi 2019-09-02 12:57:38 +0800 2018-2-13 17 ...

  9. worldcloud库的使用

    worldcloud库的使用 worldcloud是一个优秀的第三方词云展示库,用来实现比较有逼格的数据可视化效果.更加直观与艺术的展示单词. worldcloud对象的创建 worldcloud.W ...

  10. ROLLBACK - 退出当前事务

    SYNOPSIS ROLLBACK [ WORK | TRANSACTION ] DESCRIPTION 描述 ROLLBACK 回卷当前事务并取消当前事务中的所有更新. PARAMETERS 参数 ...