title: how to import image from JS file
body: <p>I am practicing on the webpack project. I got the error while I am importing the img file. I am new for webpack. I have installed the "image-webpack-loader" but still got the error.</p>
  
  <p>Here is the webpack.config.js code </p>
  
  <pre><code>const path = require('path');
  const ExtractTextPlugin = require('extract-text-webpack-plugin');
  const config = {
      entry: './src/index.js',
      output: {
          path: path.resolve(__dirname, 'build'),
          filename: 'bundle.js'
      },
      module: {
          rules: [
              {
                  use: 'babel-loader',
                  test: /\.js$/,
              },
              {
                  loader: ExtractTextPlugin.extract({
                      loader: 'css-loader'
                  }),
                  test: /\.css$/
              },
              {
                  test: /\.(jpe?g | png | gif |svg)$/,
                  use: [
                      {
                          loader: 'url-loader',
                          options: {
                              limit: 40000
                          }
                      },
                      'image-webpack-loader'
                  ]
              }
          ]
      },
      plugins: [
          new ExtractTextPlugin('style.css')
      ]
  };
  
  module.exports = config;
  </code></pre>
  
  <p>And Here is the image_viewer.js file</p>
  
  <pre><code>import '../assets/big.jpg';
  import '../assets/small.jpg';
  
  import '../styles/image_viewer.css';
  
  const image = document.createElement('img');
  image.src = 'http://lorempixel.com/400/400';
  
  document.body.appendChild(image);
  </code></pre>
  
  <p>I can't find the solution for this issue. You can see the issue. The style.css and build.js is properly bundled but when I work for image it does not work got some error which I have mentioned below.</p>
  
  <pre><code>&gt; webpack
  
  keywords if/then/else require v5 option
  Hash: 5ba37842c394273b5247
  Version: webpack 2.2.0-rc.0
  Time: 2330ms
      Asset      Size  Chunks             Chunk Names
  bundle.js   4.38 kB       0  [emitted]  main
  style.css  41 bytes       0  [emitted]  main
     [0] ./src/image_viewer.js 452 bytes {0} [built]
     [1] ./src/sum.js 177 bytes {0} [built]
     [2] ./assets/big.jpg 235 bytes {0} [built] [failed] [1 error]
     [3] ./assets/small.jpg 237 bytes {0} [built] [failed] [1 error]
     [4] ./styles/image_viewer.css 41 bytes {0} [built]
     [5] ./src/index.js 303 bytes {0} [built]
      + 1 hidden modules
  
  ERROR in ./assets/small.jpg
  Module parse failed: I:\Javascript &amp; Angular &amp; Node\webpack\assets\small.jpg Unexpected character '�' (1:0)
  You may need an appropriate loader to handle this file type.
  (Source code omitted for this binary file)
   @ ./src/image_viewer.js 7:13-43
   @ ./src/index.js
  
  ERROR in ./assets/big.jpg
  Module parse failed: I:\Javascript &amp; Angular &amp; Node\webpack\assets\big.jpg Unexpected character '�' (1:0)
  You may need an appropriate loader to handle this file type.
  (Source code omitted for this binary file)
   @ ./src/image_viewer.js 3:11-39
   @ ./src/index.js
  Child extract-text-webpack-plugin:
         [1] ./~/css-loader!./styles/image_viewer.css 204 bytes {0} [built]
          + 1 hidden modules
  npm ERR! code ELIFECYCLE
  npm ERR! errno 2
  npm ERR! jsmodule@1.0.0 build: `webpack`
  npm ERR! Exit status 2
  npm ERR!
  npm ERR! Failed at the jsmodule@1.0.0 build script.
  npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
  
  npm ERR! A complete log of this run can be found in:
  npm ERR!     C:\Users\Engraved\AppData\Roaming\npm-cache\_logs\2018-05-27T10_29_34_980Z-debug.log
  </code></pre>
  
  <p>My webpack version is "webpack": "^2.2.0-rc.0".</p>