webpack.config.js

var webpack = require('webpack');

module.exports = {
  context: __dirname + '/app',
  loaders: [
    {test: /\.css$/, loader: "style-loader!css-loader" },
    { test: /\.png$/, loader: "url-loader?limit=100000" },
    { test: /\.jpg$/, loader: "file-loader" },
    {test: /\.woff(\?v=\d+\.\d+\.\d+)?$/, loader: "url?limit=10000&mimetype=application/font-woff" },
    {test: /\.ttf(\?v=\d+\.\d+\.\d+)?$/, loader: "url?limit=10000&mimetype=application/octet-stream" },
    {test: /\.eot(\?v=\d+\.\d+\.\d+)?$/, loader: "file" },
    {test: /\.svg(\?v=\d+\.\d+\.\d+)?$/, loader: "url?limit=10000&mimetype=image/svg+xml" },
    {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"}
  ],
  entry: {
    app: ['./app.js', './app.css'],
    vendor: [
      'angular',
      'angular-route',
      'underscore',
      '!style-loader!css-loader!app.css', // This works fine as it's a simple 1 definition css file
      '!style-loader!css-loader!bootstrap/dist/css/bootstrap.css' // This blows up trying to process the font files
      'app.css',  // This doesn't work b/c `You may need an appropriate loader to handle this file type.`
      'bootstrap/dist/css/bootstrap.css' // This doesn't work b/c `You may need an appropriate loader to handle this file type.`
    ]
  },
  output: {
    path: __dirname + '/app/dist',
    filename: 'app.bundle.js',
    publicPath: '/dist'
  },
  plugins: [
    new webpack.optimize.CommonsChunkPlugin(/* chunkName= */"vendor", /* filename= */"vendor.bundle.js")
  ],
  devServer: {
    contentBase: "./app",
    hot: false
  }
};