如何在 Blazor 项目中分离 JavaScript 文件？

Question

我有一个包含 10 多个模块的大项目，每个模块都有自己的 javascript 文件，我们一次只处理一个模块，我不需要整个 javascripts 内容，所以我应该全部加载还是如何加载我可以为每个模块分开它们吗？ 为每个模块使用单独的 .cshtml 文件来托管 .razor 组件可能是一种解决方案，这是线索吗？

Answer 1

在 .NET Core 3.0 的初始版本中，Blazor 本身不支持它 见https://github.com/aspnet/AspNetCore/issues/5465

变体 1

如果你想动态加载部分JS文件，你必须假设Blazor应用程序使用的JS不是Blazor应用程序本身的一部分，而是一些可以加载每个JS模块的外部环境。 Blazor 组件必须自己手动加载 JS 模块。

// Include that file in the index.html, but not inside Razor Components Project.
function loadModule(moduleName) {
   // load module somehow, via Ajax probably.
   // This function likely has to make sure that module would not be loaded twice.
}

protected override Task OnInitializedAsync() {
   // Component load JS module.
   await jsRuntime.InvokeVoidAsync("loadModule", "component1");
}

同样，JS 文件 component1.js 应该在 Blazor 项目之外进行管理。

第 2 版

使用Assembly.Load 加载带有组件的程序集并以某种方式在 UI 中手动注入组件。反射是你的朋友。

// Component1 assumed to be present in the `dist/_framework/_bin` folder where all Blazor stuff is located.
var assembly = Assembly.Load("Component1");
foreach (var type in assembly.GetTypes())
{
    if (!type.FullName.EndsWith("ModuleLoader"))
        return;

    var moduleInstance = Activator.CreateInstance(type);
    // And now all regular .NET plugin stuff.
}