Blazor 组件JS隔离找不到js参考

Question

我创建了一个 Razor 组件库，目的是容纳一些自定义 Blazor 组件。

其中一个特别是 Infragistics Dock Manager Web 组件的包装器。

在组件库项目中，我在 wwwroot 文件夹下创建了一个名为 dockmanager 的文件夹，并将我的 javascript 包装文件 dockmanger.js 添加到其中。

我在 dockmanager.js 文件中包含了许多 JS 模块导出函数，以支持我的 Dock Manager Blazor 包装器组件。

在 Dock Manager Blazor 组件 OnAfterRenderAsync 方法中，我尝试在此代码之后获取 IJSObjectReference。

 protected override async Task OnAfterRenderAsync(bool firstRender)
    {
        try
        {
            if (firstRender)
            {
                // add reference to dockmanager.js module
                _module = await _jsRuntime.InvokeAsync<IJSObjectReference>("import", "./dockmanager/dockmanager.js");
            }
        }
        catch(Exception ex)
        {

        }
    
    }

在一个单独的 Blazor 测试项目中，我引用了我的 Razor 组件库并将 Dock Manager Blazor 组件添加到测试页面。

当我导航到包含对我的自定义组件的引用的测试页面时，在启动时，当我尝试获取 IJSObjectReference 时，自定义组件 OnAfterRenderAsync 中出现异常。

例外情况如下：

无法获取动态导入的模块：http://localhost:12203/dockmanager/dockmanager.js 类型错误：无法获取动态导入的模块：http://localhost:12203/dockmanager/dockmanager.js

我已经三次检查了路径，它们似乎是正确的。

所有独立 JS 示例都在 Blazor 项目中，但在我的情况下，我在 Blazor 组件库中创建了自定义组件，并在 Blazor 测试项目中引用。

JS文件的路径应该不同吗？

Answer 1

解决方案是按如下方式更改路径：

_module = await _jsRuntime.InvokeAsync<IJSObjectReference>("import", "./_content/NextWare.UI.Components/dockmanager/dockmanager.js");

其中 NextWare.UI.Components 是指 Blazor 组件库的名称。

我希望这对其他人有帮助！