title: Webpack dynamic import method returns empty array instead of files in reactjs, How to solve?
body: <p>How to import and use images in Reactjs?
  I have imported all images from a folder but it does't return array with links.
  check this.</p>
  
  <pre><code>    function importAll(r) {
      return r.keys().map(r);
    }
      const images = importAll(require.context('./', false, /\.(png|jpe?g|svg)$/));
      console.log(images);
  </code></pre>
  
  <p>Check this screenshot of console:</p>
  
  <p><img src="https://i.stack.imgur.com/MJR6X.png" alt=""></p>
  
  <p>Please help me in this!</p>
  
  <p>Folder structure:</p>
  
  <pre><code>--src&gt;
    --components&gt;
        Projects.jsx
    --img&gt;
         images
  </code></pre>
  
  <p>I am trying to import it in Projects component.
  but, How to do this?</p>
  
  <pre><code>import React from 'react';
  import '../App.css';
  
  function importAll(r) {
      return r.keys().map(r);
  }
  
  const images = importAll(require.context('./', false, /\.(png|jpe?g|svg)$/));
  console.log(images);
  </code></pre>
  
  <p>Please help in load the all images and use them.</p>