The current preview of Razor Components (0.8.0-preview-19104-04) broke the ability to ship content files from a component library. The ASP.NET team will fix it, but in the meantime, what can you do?
You've heard of CSS in JS?
Let's try CSS in Components.
It's not what it sounds like.
CSS In Components
Instead of shipping a CSS file, just create a CSS component
Here's my Razor Component's CSS
BlazorScrollBarCSS.cshtml |
Notice it is a Razor View, not a CSS file.
Now, in my BlazorScrollBar component, I can reference the classes from the CSS component and ship the CSS as part of the library again.
All the consuming project needs to do is place the CSS component somewhere in it's pages, for example, in App.cshtml.
This seems like a reasonable short term solution for supplying CSS with your components, until the problem is resolved.
Additional Benefit
Because the CSS is now encapsulated as a component, we can allow the consuming project more control over whether the CSS is required.
I have a parameter on my BlazorScrollBar component
...and an if statement in the Component markup
So, the consumer has the choice, they can manually include the CSS by placing the CSS component somewhere in their app, they can have the ScrollBar component include the CSS in it's own markup, or they can choose not to use my CSS.
No comments:
Post a Comment