File-loader does not work with my fonts
<p>I have a typical Webpack file with a loaders module for fonts, images, css as follows:</p>

<pre><code>  module: {
loaders: [{
  test: /\.jsx?$/,
  loaders: ['react-hot', 'babel-loader?

presets[]=es2015,presets[]=stage-1,presets[]=stage-2,presets[]=react,plugins[]=transform-runtime'],
      exclude: /node_modules/
    },
</code></pre>

<p><strong>working code:</strong></p>

<pre><code>    { test: /\.scss$/,
      exclude: /node_modules/,
      loader: ExtractTextPlugin.extract('style', 'css!sass?sourceMap')
    },
   {
       test: /\.(jpg|jpeg|gif|png|svg)$/,
       exclude: /node_modules/,
       include: PATHS.imagesLoc,
       loader: "file-loader?name=img/[name].[ext]"
   },
</code></pre>

<p><strong>Not working:</strong></p>

<pre><code>{
      test: /\.woff(2)?(\?v=[0-9]\.[0-9]\.[0-9])?$/,
      exclude: /node_modules/,
      loader: 'file-loader?limit=1024&amp;name=fonts/[name].[ext]'
    },
    { test: /\.(ttf|eot|svg)(\?v=[0-9]\.[0-9]\.[0-9])?$/,
      exclude: /node_modules/,
      loader: "file-loader?limit=1024&amp;name=fonts/test/[name].[ext]"
    }
  ]},
  plugins: [
    new webpack.DefinePlugin({
      'process.env.COSMIC_BUCKET': JSON.stringify(process.env.COSMIC_BUCKET)
    }),
    new CopyWebpackPlugin([
      { from: 'images/', to: 'img/' }
    ]),
    new ExtractTextPlugin("css/custom.css")
 ]
};
</code></pre>

<p>My root folder contains the following directories:</p>

<pre><code>const PATHS = {
  app: path.join(__dirname, './enter.js'),
  build: path.join(__dirname, './public'),
  fonts: path.join(__dirname, './fonts'),
  cssLoc: path.join(__dirname, './styles'),
  imagesLoc: path.join(__dirname, './images')
};
</code></pre>

<p>Both image and style loaders are working just fine but for some reason none of the font files get transpiled into the public/fonts directory.</p>

<p>Just like my <code>image</code> and <code>style</code> folders the fonts directory sits within the app root. Inside the <code>./fonts</code> I have two folders with their font contents <code>./fonts/roboto</code>, <code>./fontawesome</code>. These directories need to reflect inside <code>./public/</code> but for now I am not even able to get the fonts copied into the <code>./public</code> directory so you would end up with <code>./public/fonts/roboto</code> . Nothing happens. No warnings/errors nothing. How can I tell if I am doing something wrong?</p>

<p><strong>NEW WEBPACK</strong></p>

<p>Nothing renders or is copied into public/ directory. No errors.</p>

<pre><code>var webpack = require("webpack");
var HtmlWebpackPlugin = require('html-webpack-plugin');

const path = require('path');

const PATHS = {
  app: path.join(__dirname, './app-client.js'),
  build: path.join(__dirname, './public'),
  fonts: path.join(__dirname, './fonts'),
  cssLoc: path.join(__dirname, './styles'),
  imagesLoc: path.join(__dirname, './images')
};


if(process.env.NODE_ENV === 'development'){
  var loaders = ['react-hot','babel']
} else {
  var loaders = ['babel']
}

module.exports = {
    devServer: {
        inline: true,
        port: 8080,
        outputPath: PATHS.build
    },
    //bundle app from here
    entry: {
      app: PATHS.app
    },
    output: {
      path: PATHS.build,
      filename: 'bundle.js',
      publicPath: PATHS.build
    },
    module: {
        loaders: [
            {
                test: /\.jsx?$/,
                exclude: /node_modules/,
                loaders: ['react-hot', 'babel-loader?presets[]=es2015,presets[]=stage-1,presets[]=stage-2,presets[]=react,plugins[]=transform-runtime']
            },
            {
                test: /\.scss$/,
                loader: 'style!css!sass'
            },
            {
                test: /\.css$/,
                loader: 'css'
            },
            {
                test: /\.(png|gif|jpe?g|svg)$/i,
                loader: 'url?limit=50000&amp;name=img/[name]' // limit ~50kb
            },
            {
                test: /\.(otf|eot|ttf|woff|woff2)$/,
                loader: 'file?name=assets/fonts/[name].[ext]'
            },
            {
                test: /\.html$/,
                loader: 'html-loader'
            }
        ]
    },
    resolve: {
        extensions: ['', '.webpack.js', '.web.js', '.js', '.jsx']
    },
    node: {
        console: true,
        fs: 'empty',
        net: 'empty',
        tls: 'empty'
    },
    plugins: [
        new webpack.optimize.CommonsChunkPlugin({
            name: ['app', 'vendor']
        }),
        new webpack.DefinePlugin({
          'process.env.COSMIC_BUCKET': JSON.stringify(process.env.COSMIC_BUCKET)
        }),
        new webpack.HotModuleReplacementPlugin(),
        new HtmlWebpackPlugin(
            {
                template: './public/index.html'
            }
        )
    ]
}
</code></pre>