Blazor组件打包为NuGet后动态导入模块失败求助

我创建了一个基于.NET 7的Blazor Server组件，通过以下代码加载隔离的JS互操作文件：

protected override async Task OnAfterRenderAsync(bool firstRender)
{
    if (firstRender)
    {
        var dotNetObjRef = DotNetObjectReference.Create(this);
        _routeMapModule = await JsRuntime.InvokeAsync<IJSObjectReference>("import", "./_content/MyComp/MyJs.js");
        await _routeMapModule.InvokeVoidAsync("CompInit", _elRef, dotNetObjRef);
    }
}

其中MyComp是项目名称，JS文件路径为./_content/MyComp/MyJs.js。

• 项目引用方式使用组件时一切正常；
• 打包为NuGet包（通过Azure流水线）并引用后，出现Failed to load resource: the server responded with a status of 404 () / Failed to fetch dynamically imported module when packed in nuget错误；
• 解压本地NuGet包可见JS文件在根目录，但主项目生成的bin目录中不存在该文件；
• 尝试过直接用Visual Studio创建NuGet包、修改Azure生成参数，NuGet包能包含JS资源文件，但文件未发布到引用它的主项目；
• 也尝试将JS文件移至wwwroot目录，问题依旧；
• 仅项目引用模式下路径有效，NuGet打包后路径失效。

更新（2022.12.29）：仅在NuGet打包时出现问题，JS文件未同步到主项目，怀疑是Azure的NuGet打包配置问题，寻求解决办法。

1. 配置项目文件的资源打包属性
   在Blazor组件项目（MyComp）的.csproj文件中，为JS文件添加正确的打包元数据，确保被归类为Web资源：

   <ItemGroup>
     <!-- 若JS文件在根目录 -->
     <None Include="MyJs.js" Pack="true" PackagePath="wwwroot" />
     <!-- 若JS文件原本在wwwroot目录 -->
     <!-- <Content Include="wwwroot/MyJs.js" Pack="true" PackagePath="wwwroot" /> -->
   </ItemGroup>
   

   此配置会将JS文件打包到NuGet包的wwwroot目录，主项目引用后会自动部署到_content/MyComp/路径下，与代码中的引用路径匹配。

2. 检查Azure流水线打包命令参数

   • 使用dotnet pack命令时，添加--include-content-files参数强制包含配置的资源文件：

     dotnet pack MyComp.csproj --configuration Release --include-content-files --output $(Build.ArtifactStagingDirectory)
     

   • 若用Azure DevOps的NuGet打包任务，在设置中勾选Include content files，或在Arguments中添加上述参数。

3. 验证NuGet包结构
   打包后解压NuGet包，确认JS文件位于wwwroot目录下，正确结构应为：

   MyComp.nupkg
   ├── wwwroot
   │   └── MyJs.js
   ├── lib
   │   └── net7.0
   │       └── MyComp.dll
   └── MyComp.nuspec
   

4. 清理主项目缓存
   删除主项目的bin、obj目录，以及.nuget/packages下的MyComp缓存文件夹，重新构建发布，避免旧缓存导致资源未更新。

内容的提问来源于stack exchange，提问作者Jean-Marc Pannatier