如何将 Blazor Razor 类库中的 css / js 文件注入 ASP.NET Core Blazor 项目答案

【问题标题】：How to inject css / js files from a Blazor Razor Class Library to ASP.NET Core Blazor Project如何将 Blazor Razor 类库中的 css / js 文件注入 ASP.NET Core Blazor 项目
【发布时间】：2020-04-27 01:04:57
【问题描述】：

将 css / js 文件从库导入到主项目的通常过程是引用它们

<script src="_content/RazorLib1/hello.js"></script>

但也有一些 Blazor 库，例如 DevExpress.Blazor 和 this one 能够在主项目中不显式地注入他们的 css / js 文件。需要做的是调用函数 services.AddMyLibrary() 和/或 services.UseMyLibrary()

这怎么可能？我查看了 Toolbelt.Blazor.LoadingBar 库，但没有找到他是如何达到这种行为的。

【问题讨论】：

标签： blazor blazor-server-side

【解决方案1】：

为此做了一篇博文（德语） https://blog.ppedv.de/post/Razor-Classlibrary-JavaScript-einbinden

【讨论】：

谢谢。你的博文很有用！如果我在库的每个组件中使用您的代码，我将为页面加载的每个组件添加一个

【解决方案2】：

感谢HannesPreishuber 的博文，我解决了这个问题。我建议按照他的帖子更改在 jsRuntime.InvokeVoidAsync 中调用的 js 代码与

(function() {
   let scripts = document.getElementsByTagName("script");
   let exists = false;
   let index = 0;

   while(index < scripts.length && !exists){
       exists = scripts[index].src.endsWith('_content/RazorClassLibrary1/exampleJsInterop.js');
       index++;
   }

   if(!exists) {
       document.body.appendChild(
           Object.assign (
               document.createElement ('script'), {
                   src: '_content/RazorClassLibrary1/exampleJsInterop.js',
                   type: 'text/javascript'
               }));
       }
})()

所以 js 库将被追加一次。

【讨论】：

IMO 当你发现一个有用的帖子时，而不是仅仅在它下面发表评论，如果它不是你正在寻找的确切答案，你至少可以对其进行投票。