内容简介：前言：最近使用vue+webpack进行一个小项目的开发，按照官方模版文档完成项目初始化后打算引入ont-awesome字体图标库进行使用，引入过程中遇到一些问题并解决，现记录如下。一开始进展很顺利，百度了基本用法后安装：然后在main.js中引入：
前言：最近使用vue+webpack进行一个小项目的开发，按照官方模版文档完成项目初始化后打算引入ont-awesome字体图标库进行使用，引入过程中遇到一些问题并解决，现记录如下。
一开始进展很顺利，百度了基本用法后安装：
npm install font-awesome –save
然后在main.js中引入：
import ‘font-awesome/css/font-awesome.css’
接下来就开始愉快的使用各种图标了：
<i class="fa fa-search"></i> <i class="fa fa-star"></i>
npm run dev 之后效果也如预期般顺利，这样的：
然而，当我npm run build后生成dist文件夹，并部署之后发现情况改变了！
图标不见了！！
经过一些调试之后发现是webpack打包之后生成的css文件对字体的引用路径有问题：url(static/fonts/…)应该是url(../static/fonts/…)这样才能正常。
于是继续问伟大的度娘！
找到了一篇文章中午看到了曙光了（ 原文连接 ），正确的步骤应该如下：
1.安装依赖包
npm install font-awesome-loader less less-loader css-loader style-loader file-loader font-awesome -save
2.配置font-awesome-loader
打开项目目录build/webpack.base.conf配置font-awesome-loader如下：
开始运行npm run build，有一个错误来的措手不及！
还好，根据错误提示运行安装一下node-sass，所以：
3.安装node-sass
npm install node-sass@latest
此时，再执行npm run build时终于看见梦寐以求的效果，打包成功了。部署后运行也成了。
至此，可以随意使用font-awesome图标库了！
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持 码农网
猜你喜欢:
- Django的模版引擎与模版使用
- 使用Django模版生成树状结构
- 使用DOM解析来实现PHP模版引擎
- Kuiper 中使用 Golang 模版 (template) 定制分析结果
- 使用Ext JS社区版的快速模版：概述
- django总结六：视图的使用and url的配置 and 模版的使用
本站部分资源来源于网络，本站转载出于传递更多信息之目的，版权归原作者或者来源机构所有，如转载稿涉及版权问题，请联系我们。
程序设计语言理论基础
米切尔 / 电子工业出版社 / 2006-11 / 68.00元
本书提出了一个框架，用于分析程序设计语言的语法、操作和语义性质，该框架基于称为类型化λ演算的数学系统。λ演算的主要特色是对于函数和其他可计算的值的一种记法，以及一个等式逻辑和用于表达式求值的一组规则。本书中最简单的系统是称为泛代数的一个等式系统，它可以用来公理化和分析通常用于程序设计的许多数据类型。可作为理论计算机科学、软件系统和数学专业的大学本科高年级或者研究生初始学习阶段的教材，同时也适合用于......一起来看看 《程序设计语言理论基础》 这本书的介绍吧!
