title: NextJS: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined
body: <p>Using Nextjs and I've created an index.js in the /pages directory and created meta.js in the /components/meta/ directory.</p>
  
  <p>As my app rebuilds I get the following error:</p>
  
  <blockquote>
    <p>Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined.</p>
  </blockquote>
  
  <p>As seen below I am importing Meta correctly, it is also a default export. Curious where I'm going wrong.</p>
  
  <p><strong>pages/index.js</strong></p>
  
  <pre><code>// import Head from 'next/head'
  import Meta from '../components/meta/meta';
  
  export default () =&gt; (
    &lt;div&gt;
      &lt;Meta /&gt;
      &lt;p&gt;Hello world! Welcome to&lt;/p&gt;
      &lt;h1&gt;Moonholdings.io&lt;/h1&gt;
    &lt;/div&gt;
  )
  </code></pre>
  
  <p><strong>components/meta/meta.js</strong></p>
  
  <pre><code>import Head from 'next/head'
  
  export default () =&gt; (
    &lt;Head&gt;
      &lt;title&gt;Moonholdings.io&lt;/title&gt;
      &lt;meta name="description" content="Your Cryptocurrency Portfolio" /&gt;&gt;
      &lt;meta name="keywords" content="cryptocurrency, crypto, portfolio, bitcoin, ethereum, holdings"/&gt;
      &lt;meta name="robots" content="index, follow" /&gt;
      &lt;meta name="viewport" content="initial-scale=1.0, width=device-width" /&gt;
    &lt;/Head&gt;
  )
  </code></pre>
  
  <p>Project structure</p>
  
  <p><a href="https://i.stack.imgur.com/f5eeF.png" rel="noreferrer"><img src="https://i.stack.imgur.com/f5eeF.png" alt="enter image description here"></a></p>