title: Webpack - Karma: test failing when trying to parse a jpg
body: <p>I have an Angular1.6 app which uses Webpack to bundle and Karma for unit tests.   My unit tests are currently failing with the following error:</p>
  
  <pre><code>ERROR in ./src/app/core/nav.template.html
  Module not found: Error: Can't resolve './\"/img/avatars/avatar10.jpg\"' in '/home/brian/Projects/frontend/src/app/core'
   @ ./src/app/core/nav.template.html 1:624-676
   @ ./src/app/core/nav.component.js
   @ ./src/app \.js$
   @ ./webpack.karma.context.js
  </code></pre>
  
  <p>I think this means the test can't 'read' the JPG file. When I'm browsing the page I can see the image correctly so I'm setting it up properly there but not in my karma config.  Here is the relevant section from my <code>webpack.conf</code>:</p>
  
  <pre><code>module.exports = {
    module: {
      . . .
      rules: [
        {
          test: /\.(jpe?g|png|gif|svg)$/i,
          loaders: [
            'file-loader?hash=sha512&amp;digest=hex&amp;name=[hash].[ext]',
            'image-webpack-loader?bypassOnDebug&amp;optimizationLevel=7&amp;interlaced=false'
          ]
        }
      ]
    }
  };
  </code></pre>
  
  <p>And part of my <code>karma.conf</code></p>
  
  <pre><code>module.exports = function(config) {
    config.set({
      basePath: '',
      frameworks: [
        'jasmine',
        'es6-shim'
      ],
      files: [
        'webpack.karma.context.js',
        'node_modules/jquery/dist/jquery.js'
      ],
      exclude: [],
      preprocessors: {
        'webpack.karma.context.js': ['webpack', 'sourcemap']
      },
      webpackMiddleware: {
        stats: 'errors-only'
      },
      webpack: {
        devtool: 'inline-source-map',
        module: {
          rules: [
            {
              test: /\.(jpe?g)$/i,
              loaders: [
                'file-loader?hash=sha512&amp;digest=hex&amp;name=[hash].[ext]',
                'image-webpack-loader?bypassOnDebug&amp;optimizationLevel=7&amp;interlaced=false'
              ]
            }
          ]
        },
        plugins: [
          new webpack.ProvidePlugin({
            $: 'jquery',
            'window.$': 'jquery',
            jQuery: 'jquery',
            'window.jQuery': 'jquery',
            moment: 'moment',
            jstree: 'jstree'
          })
        ]
      }
    });
  };
  </code></pre>