vue中引入font-awesome

npm i -S font-awesome

 之后在main.js中引入font-awesome

import 'font-awesome/css/font-awesome.css'

执行npm run dev 时报错了： 

in ./node_modules/[email protected]@font-awesome/fonts/fontawesome-webfont.woff?v=4.7.0 

解决办法： 

 {         
        test: /\.(gif|jpg|jpeg|png|svg)$/,
        use: [
          {
            loader: "url-loader",
            options: {
              limit: 1024 * 30, // 当文件大小小于limit byte时会把图片转换为base64编码的dataurl，否则返回普通的图片
              name: "assest/images/[name]-[hash:5].[ext]", // 图片文件名称加上内容哈希
              fallback: "file-loader",
              publicPath: "../../"
            }
          }
        ]
      },
      {
      test: /\.(woff|ttf|eot)\??.*$/,
      use: [
        {
          loader: "file-loader",
          options: {
            name: "assest/font/[name].[ext]",
            // fallback: "file-loader",
            publicPath: "../../"
          }
        }
      ]
    }

 上面把字体文件单独提取出来

使用如下：

<i class="fa fa-clock-o"></i>