Add Font-Awesome to Webpack!

icon.js

// React component to place Font Awesome items on the page! 

import React, { PropTypes } from 'react'
import cx from 'classnames'

const Icon = React.createClass({
  propTypes: {
    name: PropTypes.string.isRequired,
    classNames: PropTypes.string
  },

  _buildClassNames () {
    const { name } = this.props
    const fontAwesomeClassName = `fa fa-${name}`
    return cx(fontAwesomeClassName, this.props.classNames)
  },

  render () {
    const classNames = this._buildClassNames()

    return(
      <i className={classNames} aria-hidden="true"></i>
    )
  }
})

export const Icon

index.js

require('./sass/font-awesome/scss/font-awesome.scss')

instructions.md

Download Font Awesome, place fonts/scss in your sass folder

webpack.config.babel.js

// Place in webpack config (loaders) section 

{test: /\.scss$/, loader: ExtractTextPlugin.extract('style', 'css!sass')},
{
  test: /\.(eot|svg|ttf|woff(2)?)(\?v=\d+\.\d+\.\d+)?/,
  loader: 'url'
}