title: Webpack problems importing font-awesome library
body: <p>I'm building a React application that will require font-awesome CSS to be imported, but I'm getting an error saying that the module cannot parse the woff2 files. </p>
  
  <p>Below is my code:</p>
  
  <pre><code>import React from 'react';
  import ReactDOM from 'react-dom';
  
  require('css!../node_modules/bootstrap/dist/css/bootstrap.css')
  require('css!../node_modules/font-awesome/css/font-awesome.css')
  
  import '../node_modules/bootstrap/dist/js/bootstrap.js'
  
  import Dashboard from './components/Dashboard/Dashboard';
  
  ReactDOM.render(
    &lt;Dashboard/&gt;,
    document.getElementById('react-container')
  );
  </code></pre>
  
  <p>This is the error I'm getting in the browser:</p>
  
  <pre><code>When running on browser I'm getting the following error:
  bundle.js:669 ./~/font-awesome/fonts/fontawesome-webfont.woff2?v=4.7.0
  Module parse failed: D:\DEV\airwaysprj\node_modules\font-awesome\fonts\fontawesome-webfont.woff2?v=4.7.0 Unexpected character '' (1:4)
  You may need an appropriate loader to handle this file type.
  SyntaxError: Unexpected character '' (1:4)
      at Parser.pp$4.raise (D:\DEV\airwaysprj\node_modules\acorn\dist\acorn.js:2221:15)
      at Parser.pp$7.getTokenFromCode (D:\DEV\airwaysprj\node_modules\acorn\dist\acorn.js:2756:10)
      at Parser.pp$7.readToken (D:\DEV\airwaysprj\node_modules\acorn\dist\acorn.js:2477:17)
      at Parser.pp$7.nextToken (D:\DEV\airwaysprj\node_modules\acorn\dist\acorn.js:2468:15)
      at Parser.pp$7.next (D:\DEV\airwaysprj\node_modules\acorn\dist\acorn.js:2413:10)
      at Parser.pp$3.parseIdent (D:\DEV\airwaysprj\fways\node_modules\acorn\dist\acorn.js:2191:10)
      at Parser.pp$3.parseExprAtom (D:\DEV\airwaysprj\fways\node_modules\acorn\dist\acorn.js:1774:21)
      at Parser.pp$3.parseExprSubscripts (D:\DEV\airwaysprj\fways\node_modules\acorn\dist\acorn.js:1715:21)
      at Parser.pp$3.parseMaybeUnary (D:\DEV\airwaysprj\fways\node_modules\acorn\dist\acorn.js:1692:19)
      at Parser.pp$3.parseExprOps (D:\DEV\airwaysprj\fways\node_modules\acorn\dist\acorn.js:1637:21)
      at Parser.pp$3.parseMaybeConditional (D:\DEV\airwaysprj\fways\node_modules\acorn\dist\acorn.js:1620:21)
      at Parser.pp$3.parseMaybeAssign (D:\DEV\airwaysprj\fways\node_modules\acorn\dist\acorn.js:1597:21)
   @ ./~/css-loader!./~/font-awesome/css/font-awesome.css 6:479-532
    [1]: https://webpack.github.io/docs/stylesheets.html
  </code></pre>
  
  <p>And my <code>webpack.config.js</code> file:</p>
  
  <pre><code>var path = require('path');
  
  module.exports = {
      entry: "./client/app.js",
      output: {
          path: __dirname + "/dist",
          filename: "bundle.js",
          publicPath: "/dist"
      },
      module: {
          loaders: [
              {
                  exclude: /(node_modules)/,
                  loader: 'babel',
                  query: {
                      presets: ['es2015', 'react']
                  }
              },
          ],
          rules: [
              {
                  test: /\.css$/,
                  use: [ 'style-loader', 'css-loader']
              },
              {
                  test: /images\/.*\.(png|jpg|svg|gif)$/,
                  loader: 'url-loader?limit=10000&amp;name="[name]-[hash].[ext]"',
              },
              {
                  test: /fonts\/.*\.(woff|woff2|eot|ttf|svg)$/,
                  loader: 'file-loader?name="[name]-[hash].[ext]"',
              }
          ]
      },
      watch: true
  }
  </code></pre>
  
  <p>Help appreciated to solve this issue.</p>