使用 webpack 打包 font-awesome
jf wang Lv7

npm install font-awesome --save 后在主scss文件中:
@import ~font-awesome 会报很多问题

问题主要是两方面:

  • 路径
  • 加载器

路径

1
2
3
@import "~font-awesome/scss/variables";
$fa-font-path: "~font-awesome/fonts";
@import "~font-awesome/scss/font-awesome";

加载器

1
2
3
4
5
6
7
8

module: {
rules: [
{test: /\.eot(\?v=\d+.\d+.\d+)?$/, loader: 'file-loader'},
{test: /\.woff(2)?(\?v=[0-9]\.[0-9]\.[0-9])?$/, loader: 'url-loader?limit=10000&mimetype=application/font-woff'},
{test: /\.(ttf|eot|svg)(\?v=[0-9]\.[0-9]\.[0-9])?$/, loader: "file-loader?limit=10000"},
]
}
  • 本文标题:使用 webpack 打包 font-awesome
  • 本文作者:jf wang
  • 创建时间:2017-02-21 21:09:46
  • 本文链接:https://www.wangjunfeng.com.cn/2017/02/21/webpack-font-awesome/
  • 版权声明:本博客所有文章除特别声明外,均采用 BY-NC-SA 许可协议。转载请注明出处!