title: React Error: Error: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components)
body: <p>I've tried to find the answer via similar questions but haven't been able to get this resolved.</p>
  <p>When I run a react app, I get the following error:</p>
  <p><strong>Error: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: object. You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.
  Check the render method of <code>App</code>.</strong></p>
  <p>My index.js file looks like this:</p>
  <pre><code>import React from 'react'
  import ReactDOM from 'react-dom'
  import './index.css'
  import App from './App'
  import { AppProvider } from './context'
  ReactDOM.render(
    &lt;React.StrictMode&gt;
      &lt;AppProvider&gt;
      &lt;App /&gt;
      &lt;/AppProvider&gt;
    &lt;/React.StrictMode&gt;,
    document.getElementById('root')
  );
  
  </code></pre>
  <hr />
  <p>And my App.js file looks like this:</p>
  <pre><code>import React from &quot;react&quot;;
  import { BrowserRouter as Router, Route, Switch } from &quot;react-router-dom&quot;;
  // import pages
  import Home from &quot;./pages/Home&quot;;
  import About from &quot;./pages/About&quot;;
  import SingleCocktail from &quot;./pages/SingleCocktail&quot;;
  import Error from &quot;./pages/Error&quot;;
  // import components
  import Navbar from &quot;./components/Navbar&quot;;
  function App() {
    return (
      &lt;Router&gt;
        &lt;Navbar /&gt;
        &lt;Switch&gt;
          &lt;Route exact path=&quot;/&quot;&gt;
            &lt;Home /&gt;
          &lt;/Route&gt;
          &lt;Route path=&quot;/about&quot;&gt;
            &lt;About /&gt;
          &lt;/Route&gt;
          &lt;Route path=&quot;/cocktail/:id&quot;&gt;
            &lt;SingleCocktail /&gt;
          &lt;/Route&gt;
          &lt;Route path=&quot;*&quot;&gt;
            &lt;Error /&gt;
          &lt;/Route&gt;
        &lt;/Switch&gt;
      &lt;/Router&gt;
    );
  }
  
  export default App;
  </code></pre>
  <p>I originally had issues with the imports which I was able to resolve but I'm lost.</p>
  <p>Any points on what to look at would be great, thank you :)</p>