title: Separate CSS files using create-react-app code-splitting without ejecting
body: <p>I am using <code>react-loadable</code> to leverage code-splitting due to my application becoming too large not to do this. This is all working but the CSS is embedded in these new JavaScript chunks and then seemingly dynamically loaded into the page. I would like the CSS from each of these chunks to be in separate files rather than inside the JS file itself. Can I accomplish this without ejecting and modifying th Webpack config myself? I would really like to avoid that if possible.</p>
  
  <p><strong>EDIT:</strong>
  I've just ejected to see what the actual Webpack configuration is doing. The following comment confirms the issue I'm having but doesn't offer a solution:</p>
  
  <p><a href="https://i.stack.imgur.com/VIruk.png" rel="noreferrer"><img src="https://i.stack.imgur.com/VIruk.png" alt="enter image description here"></a></p>
  
  <p>Note the last sentence:</p>
  
  <blockquote>
    <p>If you use code splitting, however, any async bundles will still use the
    "style" loader inside the async code so CSS from them won't be in the
    main CSS file.</p>
  </blockquote>