title: Webpack outputs wrong path for images
body: <p>I'm building a site with react and webpack. When I build the app with webpack and try to include images, the images are written to the build folder along with the other assets, but the link to the image that webpack outputs is incorrect. I can go in the build folder and view the image, so it is being copied correctly it is the link that is wrong. </p>
  
  <p>my react component looks like this: </p>
  
  <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>'use strict';
  
  var React = require('react');
  var newsFeedIcon = require('../../img/news-feed-icon.png');
  
  //create story component
  module.exports = React.createClass({
    render: function () {
      return (
          &lt;div className="col_12 footer-right mobile-foot"&gt;
          &lt;img src={newsFeedIcon} /&gt;
          &lt;p&gt;&lt;a href="/about"&gt;About Us&lt;/a&gt; | &lt;a href="/contact"&gt;Contact Us&lt;/a&gt; | &lt;a href="/faq"&gt;FAQ&lt;/a&gt; | &lt;a href="/media"&gt;Media&lt;/a&gt; | &lt;a href="#"&gt;Privacy Statement&lt;/a&gt; | &lt;a href="#"&gt;Terms of Service&lt;/a&gt;&lt;/p&gt;
        &lt;/div&gt;
        );
    }
  })</code></pre>
  </div>
  </div>
  </p>
  
  <p>My Webpack configuration looks like this: </p>
  
  <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>    webpack: {
        client: {
          entry: __dirname + '/app/js/client.jsx',
          output: {
            path: 'build/',
            file: 'bundle.js'
          },
          module: {
            loaders: [
            {
              test: /\.jsx$/,
              loader:'jsx-loader'
            },
            {
              test: /\.css$/,
              loader: "style-loader!css-loader"
            },
            {
              test: /\.(eot|woff|woff2|ttf|svg|png|jpg)$/,
              loader: 'url-loader?limit=30000&amp;name=[name]-[hash].[ext]'
            },         
            { 
              test: /\.jpe?g$|\.gif$|\.png$/i, 
              loader: 'file-loader' 
            },
            {
              test: /\.jpg/,
              loader: 'file'
            }]
          }
        },
        test: {
          entry: __dirname + '/test/client/test.js',
          output: {
            path: 'test/client/',
            file: 'bundle.js'
          },
          module: {
            loaders: [
            {
              test: /\.jsx$/,
              loader:'jsx-loader'
            }] 
          }
        },
        karma_test: {
          entry: __dirname + '/test/karma_tests/test_entry.js',
          output: {
            path: 'test/karma_tests/',
            file: 'bundle.js'
          },
          module: {
            loaders: [
            {
              test: /\.jsx$/,
              loader:'jsx-loader'
            }]
          },
          background: true
        }
      },</code></pre>
  </div>
  </div>
  </p>
  
  <p>I've been banging my head against the wall on this since yesterday, so any help would be appreciated. Let me know you need more info.</p>
  
  <p>Thanks!</p>