cra-build-watch icon indicating copy to clipboard operation
cra-build-watch copied to clipboard

Published 20 hours ago • verified publisher icon Nargonath

feat: React workspaces and css loaders

Open darraghmckay opened this issue 3 years ago • 0 comments

Hey 👋

First of all thanks for building this out, it's been quite helpful

This PR introduces two changes that I needed, and I think some people in the community needed:

  • Introduce a new config flag use-react-workspaces

    • My project is setup with lerna & react workspaces so I use the @react-workspaces/react-scripts versions of react-scripts
    • The config flag just pretends @react-workspaces/ to everywhere you previously used react-scripts

  • Add in MiniCssExtractPlugin which will bundle any CSS files imported in a react component such as

      import '../styles/index.css';`
    • The bundled CSS file will then be included as part of the index.htmls <head> section
    • To do this I had to filter out style-loader which I believe appends it at run-time using window

I understand that these changes might not suit the overall direction of the project, particularly because introducing MiniCssExtractPlugin introduces an explicit dependency on a webpack version (if someone can tell me how to get around that it would be even better

If you think I should split these changes up I will happily do that too, I was just solving my own problems as I went and figured it would be best to contribute back.

Thanks again

darraghmckay avatar Apr 08 '21 14:04 darraghmckay