title: Index.js module imports with webpack
body: <p>My code is organised as follows: </p>
  
  <p><a href="https://i.stack.imgur.com/UtELN.png" rel="nofollow"><img src="https://i.stack.imgur.com/UtELN.png" alt="Folder hierarchy"></a></p>
  
  <p>where, </p>
  
  <p>Resources/ActionLog/Components/Layout.js </p>
  
  <pre><code>import React from 'react';
  
  export default class Layout extends React.Component {
      render() {
          return (
              &lt;p&gt;Test&lt;/p&gt;
          );
      }
  }
  </code></pre>
  
  <p>Resources/ActionLog/Components/index.js</p>
  
  <pre><code>export * from './Layout';
  </code></pre>
  
  <p>Resources/ActionLog/index.js</p>
  
  <pre><code>import React from 'react';
  import ReactDOM from 'react-dom';
  
  import Layout from './Components'; // &lt;--- ISSUE HERE.
  
  const app = document.getElementById('app');
  ReactDOM.render(
      &lt;Layout/&gt;,
      app
  );
  </code></pre>
  
  <p>Why does <code>Layout</code> not get imported using this setup?? </p>
  
  <p>If i change the line to read, </p>
  
  <p><code>import Layout from './Components/Layout';</code></p>
  
  <p>it works fine, but otherwise <code>Layout</code> is always undefined! Even when if i try, </p>
  
  <p><code>import Layout from './Components/index';</code> </p>
  
  <p>I am using webpack as my module bundler, and have achieved something similar before, I just don't see why/how this is different.. </p>