Quantcast
Channel: Active questions tagged blazor - Stack Overflow
Viewing all articles
Browse latest Browse all 4839

Consuming external client libraries in Blazor Razor Class Library

$
0
0

I'm creating a Razor Class Library (RCL) to use within several solutions. Some of these solutions may use this RCL alongside others within each project.

This RCL will also use some external client libraries. For a standard Blazor Web App, I would usually add these by using add on the context menu:

enter image description here

This isn't this option within the context menu for RCL. Using Font-Awesome as an example, I can add the files manually.

enter image description here

However, the only way I've found to consume them within the component is including them within the markup for the component.

<link href="_content/{ProjectName}/css/font-awesome/css/all.css" rel="stylesheet" /><div class="my-component"><i class="fa-solid fa-arrow-up-long"></i>    This component is defined in the <strong>BlazorCustomComponents</strong> library.</div>

I like the fact that the user just consumes the RCL and it has everything it needs and the user doesn't need to add the client libraries to the consuming Blazor Web App; however I'm not entirely sure I'm using the right approach.

  1. Manually adding the files seems cumbersome and maybe hard to maintain
  2. Adding the stylesheet reference within the component feels 'bad form' compared to having it something like the _imports.razor that I would do for Nugets.
  3. If the component is used twice on the same page, does it pull in two copies of Font-Awesome?
  4. If I'm using 3 other RCLs that use Font-Awesome in the same razor page on the consuming web app, I assume each would have it's own copy? I know the font-awesome size is tiny compared to modern connection speeds, but if I'd like to follow the correct concept as in the future I may need to replicate the approach with something more 'heavy'.

Viewing all articles
Browse latest Browse all 4839

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>