title: Webpack Circular dependencies with dynamic import
body: <p>Hi i am building an app where i found myslef doing circular dependency but webpack does not give me circular deps error. so i wanted to understand what actually is happening here . </p>
  
  <p>so here is how my module imports are done</p>
  
  <p>1.<code>root.router.config.js</code></p>
  
  <pre><code>import React from 'react'
  
  const AsyncAdmin = React.lazy(()=&gt;import('./Modules/Admin'));
  
  export ROUTER_CONFIG = {
     admin: {
        component: AsyncAdmin,
        path: '/'
     } 
  }
  </code></pre>
  
  <p>2.<code>Modules/Admin/index.js</code></p>
  
  <pre><code>import {Router} from 'react-router-dom'
  import MODULE_ROUTER from './Admin.router.config'
  
   // renders router from this MODULE_ROUTER
  
  </code></pre>
  
  <ol start="3">
  <li><code>Modules/Admin/Admin.router.config.js</code></li>
  </ol>
  
  <pre><code>import React from 'react'
  import {ROUTER_CONFIG as ROOT_ROUTER_CONFIG} from '../../root.router.config' // should be cyclic import error but its not
  
  const base = ROOT_ROUTER_CONFIG['admin'].path
  
  const AsyncDashboard = React.lazy(()=&gt;import('./Routes/Dashboard'));
  
  export ROUTER_CONFIG = {
     dashbaord: {
        component: Dashboard,
        path: base + 'dashboard'
     } 
  }
  </code></pre>
  
  <p>if you see the imports here </p>
  
  <p><code>Modules/Admin/Admin.router.config.js</code> =imports> <code>root.router.config</code> =imports(lazy)=> <code>Modules/Admin/Admin.router.config.js</code></p>
  
  <p>this will be a definite circular import if i am not using lazy/dynamic import. </p>
  
  <p>i want to know why webpack treats it differently and why its not a circular import error. </p>
  
  <p>should i avoid it and move to a better approach where there is no chance of circular imports ?</p>
  
  <p>and if i continue to do this. will it have any impact on my bundled code ?</p>