1、安装font-awesome和font-awesome-loader及依赖

git：https://github.com/shakacode/font-awesome-loader

npm install font-awesome-loader less less-loader css-loader style-loader file-loader font-awesome -save

2、配置webpack

官方给出的webpack2.0配置如下：

但是实际上会出现如下错误：

解决办法：

3、使用（pug）

i(class='fa fa-comments' slot="icon" )

webpack之font-awesome的更多相关文章

  1. 使用 webpack 打包 font 字体的问题

    之前在使用 Vue 做项目的时候使用了 font 字体,然而在打包的时候 font 字体的引用路径不正确. 解决办法就是在 webpack 的配置文件中设置根路径 目录在 \config\index. ...

  2. webpack 使用优化指南

    前言 本文不是webpack入门文章,如果对webpack还不了解,请前往题叶的Webpack入门,或者阮老师的Webpack-Demos. 为什么要使用Webpack 与react一类模块化开发的框 ...

  3. webpack构建vue项目（配置篇）

    最近公司要求用vue重构项目,还涉及到模块化开发,于是乎,我专门花了几天的时间研究了一下webpack这个目前来看比较热门的模块加载兼打包工具,发现上手并不是很容易,现将总结的一些有关配置的心得分享出 ...

  4. webpack使用优化（基本篇）

    转自:https://github.com/lcxfs1991/blog/issues/2 前言 本文不是webpack入门文章,如果对webpack还不了解,请前往题叶的Webpack入门,或者阮老 ...

  5. [转]WebPack 常用功能介绍

    概述 Webpack是一款用户打包前端模块的工具.主要是用来打包在浏览器端使用的javascript的.同时也能转换.捆绑.打包其他的静态资源,包括css.image.font file.templa ...

  6. WebPack常用功能介绍

    概述 Webpack是一款用户打包前端模块的工具.主要是用来打包在浏览器端使用的javascript的.同时也能转换.捆绑.打包其他的静态资源,包括css.image.font file.templa ...

  7. webpack 的简单使用

    p.p2 { margin: 0.0px 0.0px 0.0px 0.0px; font: 14.0px "Helvetica Neue"; color: #323333 } p. ...

  8. 使用webpack打包ThinkPHP的资源文件

    使用webpack打包ThinkPHP的资源文件 利用自己的空余时间一直在维护http://www.wx2share.com这个小网站,全是一个人在弄,由于只租得起虚拟空间,所以后台采用了简单方便的T ...

  9. vue-cli + webpack 多页面实例应用

    关于vue.js vue.js是一套构建用户界面的 轻型的渐进式前端框架.它的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件.使用vue可以给你的开发带来极致的编程体验. 关于vu ...

  10. vue-cli + webpack

    vue-cli + webpack 关于vue.js vue.js是一套构建用户界面的 轻型的渐进式前端框架.它的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件.使用vue可以给你 ...

随机推荐

  1. 关于android的2.2与4.4的文件读取的一点发现

    好久没有写文章了,本来想写的东西,时间一长,就感觉不想写了.没什么用,到用时.又不知道去哪找了或怎么解决. 有一句话说的好啊,好记性不如烂笔头. 我要做到善于总结.及时整理,额............ ...

  2. 3、在编译过程中出现no space left on device

    原因:通过df -h查看发现磁盘空间不错  删掉不需要的文件后执行sudo apt-get clean

  3. 【POJ 1226】Substrings

    [链接]h在这里写链接 [题意] 给你n个字符串. 让你找一个字符串s. 设s'为这个字符串的逆序. 要求s或者s'在每个字符串里都能够找得到. 并且要求s的长度最长. 求出这个最长的串的长度. [题 ...

  4. dp hdu5653 xiaoxin and his watermelon candy

    传送门:点击打开链接 题意:有n个箱子排成一排,有m个炸弹.位置告诉你.如今炸弹的左边伤害和右边伤害能够自己控制,要求 每一个炸弹炸的箱子数的累乘,输出答案取log2并乘以1e6 思路:直接2for ...

  5. web中的重定向与转发

    Redirect:重定向(客户端重定向) 是HTTP协议规定的一种机制:当client向server发送一个请求,要求获取一个资源时,在server接收到这个请求后发现请求的这个资源实际存放在另一个位 ...

  6. 网站访问优化(二)：开启apache服务器gzip压缩

    昨天,把带宽从1M升级到2M,使用cdn版本的jquery之后,网站访问速度由平均5s(在禁止缓存的情况下,使用缓存大概在2.8s)下降到2.8s的样子. 今天,继续优化. 第1步:   把图片进行了 ...

  7. js实现操作等待提示loading……

    js实现操作等待功能,防止重复提交,界面友好,底部为灰色遮罩层,防止用户重复操作. 先看效果图:   接着看js代码: //关闭等待窗口 function closeWaiting() { var b ...

  8. 【solr基础教程之九】客户端 分类： H4_SOLR/LUCENCE 2014-07-30 15:28 904人阅读 评论(0) 收藏

    一.Java Script 1.由于Solr本身可以返回Json格式的结果,而JavaScript对于处理Json数据具有天然的优势,因此使用JavaScript实现Solr客户端是一个很好的选择. ...

  9. 在word中使用notepad++实现代码的语法高亮 分类： C_OHTERS 2013-09-22 10:38 2273人阅读 评论(0) 收藏

    转载自:http://blog.csdn.net/woohello/article/details/7621651 有时写文档时需要将代码粘贴到word中,但直接粘贴到word中的代码虽能保持换行与缩 ...

  10. Facebook开源软件列表

    从 Facebook 的 GitHub 账户中可以看到,Facebook 已经开源的开源项目有近 300 个,领域涉及移动.前端.Web.后端.大数据.数据库.工具和硬件等.Facebook 开源项目 ...