WebPack 使用 FontAwesome 字体

简介

由于现代浏览器的趋势，以及HTML5、CSS3的普及,现在多数图标从当初的Image(PNG、GIF、JPEG)图片从而转变为Font Icon字体

环境要求

1. NodeJS
2. NPM
3. WebPack

安装FontAwesome及相关插件

1

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

在webpack.conf.js 中的module.rules 添加规则

1

{ test: /\.(eot|svg|ttf|woff|woff2|png)\w*/, loader: 'file-loader' }

在项目开始JS文件中导入 font-awesome-webpack

1

import 'font-awesome-webpack';