Since you're using Material UI, I recommend you have a look at how it does styling with JSS, their approach to theming, etc: material-ui.com/styles/basics/
The different approaches to bundling css for libraries would be a good topic for another blog post, I deliberately chose not to cover that here, to focus on monorepo-structure more. In the end, CRA will split your css in chunks when building. So the question is how your library users will consume that. If your CRA App is the only consumer, I'd recommend importing css only in the *.story-files, keeping it out of your components. In your CRA App, add an scss file that imports all the css you need, e.g. @import "../../ui-lib/src/components/yourfile.css. This is more a practical approach than a clean approach, but it separates concerns and will thus continue to work, even if there's a version update to create-react-app.
If you want to publish your library, see which CSS-with-javascript combination you're using (JSS, CSS Modules, ...) and check for the recommended build process.
For further actions, you may consider blocking this person and/or reporting abuse
We're a place where coders share, stay up-to-date and grow their careers.
Hi @shnyder,
The component CSS files are not getting copied from
my-monorepo-ui-libtomy-monorepo-cra-app. So I am getting this error.../my-monorepo-ui-lib/lib-esm/components/card/card.jsModule not found: Can't resolve './card.css
Thanks,
Anil
Since you're using Material UI, I recommend you have a look at how it does styling with JSS, their approach to theming, etc: material-ui.com/styles/basics/
The different approaches to bundling css for libraries would be a good topic for another blog post, I deliberately chose not to cover that here, to focus on monorepo-structure more. In the end, CRA will split your css in chunks when building. So the question is how your library users will consume that. If your CRA App is the only consumer, I'd recommend importing css only in the *.story-files, keeping it out of your components. In your CRA App, add an scss file that imports all the css you need, e.g.
@import "../../ui-lib/src/components/yourfile.css. This is more a practical approach than a clean approach, but it separates concerns and will thus continue to work, even if there's a version update to create-react-app.If you want to publish your library, see which CSS-with-javascript combination you're using (JSS, CSS Modules, ...) and check for the recommended build process.