title: Using switch statement with dynamic components in NextJS
body: <p>I am trying to use dynamic import in NextJS and I do not understand why it works only while storing imported component in a variable. It breaks when I try to return it from other function.</p>
  
  <p>It works this way:</p>
  
  <pre><code>import dynamic from "next/dynamic";
  
  
  const Article = dynamic(() =&gt; import("tutorial/ru/welcome.mdx"));
  </code></pre>
  
  <p>but like this, well, it breaks:</p>
  
  <pre><code>import dynamic from "next/dynamic";
  
  export default ({ route }) =&gt; {
    switch (route) {
      case "ru":
      default:
        return dynamic(() =&gt; import("tutorial/ru/welcome.mdx"));
    }
  };
  </code></pre>
  
  <p>I get the <em>Invalid hook call. Hooks can only be called inside of the body of a function component</em> message.</p>