title: Not able to render react functional component
body: <p>I am trying to setup a basic react application(Hello World) on my laptop. I am using react and react-dom ( version 15.5.4) alongwith babel, webpack and yarn to run/test it. </p>
  
  <p>I am getting <strong>Uncaught ReferenceError: Button is not defined</strong> for a pure function component that I have defined in App.jsx. 
  Here are the content + the application directory structure I have used.</p>
  
  <p><strong>App.jsx</strong></p>
  
  <pre><code>import React from 'react';
  
  
  /*
  export default class App extends React.Component {
      render() {
          return(
              &lt;div&gt;
                  &lt;h1&gt;Hello World&lt;/h1&gt;
              &lt;/div&gt;
              );
      }
  }*/
  
  const Button = () =&gt; {
      return(&lt;button&gt;Go&lt;/button&gt;);
  };
  
  export default Button;
  </code></pre>
  
  <p><strong>index.js</strong></p>
  
  <pre><code>import React from 'react';
  import ReactDOM from 'react-dom';
  import App from './components/App.jsx';
  
  //ReactDOM.render(&lt;App /&gt;, document.getElementById('root'));
  ReactDOM.render(&lt;Button /&gt;, document.getElementById('test'));
  </code></pre>
  
  <p><strong>index.html</strong></p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
    &lt;head&gt;
      &lt;meta charset="utf-8"&gt;
      &lt;title&gt;React App Setup&lt;/title&gt;
    &lt;/head&gt;
    &lt;body&gt;
      &lt;!-- &lt;div id="root"&gt;&lt;/div&gt; --&gt;
      &lt;div id="test"&gt;&lt;/div&gt;
    &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p><strong>Directory Structure</strong></p>
  
  <pre><code>&lt;root_directory&gt;
  |_client
         |_components
                    |_App.jsx
         |_index.html
         |_index.js
  </code></pre>
  
  <p>Please let me know, if the package.json, webpack config and .babelrc file content is required as well.</p>
  
  <p>The browser console shows the below error.</p>
  
  <pre><code>Uncaught ReferenceError: Button is not defined
      at Object.&lt;anonymous&gt; (index_bundle.js:12891)
      at __webpack_require__ (index_bundle.js:20)
      at Object.&lt;anonymous&gt; (index_bundle.js:30981)
      at __webpack_require__ (index_bundle.js:20)
      at module.exports (index_bundle.js:66)
      at index_bundle.js:69
  </code></pre>