如何在 NuGet 包中包含 JS 文件

Question

我需要创建一个 .NET Standard 2.1 NuGet 包，其中包含一个 JavaScript 文件，该文件将添加到我的消费应用程序的以下路径中：

/wwwroot/js/myFileFromNugetPackage.js

（消费应用程序恰好是 Blazor Server 应用程序）

我关注了一个 example，它使用了 *.targets 文件，但它对我不起作用。

我最接近的是按如下方式设置我的 NuGet 项目：

创建一个名为 "wwwroot"
添加文件"wwwroot/js/myFileFromNugetPackage.js"
在该 JS 文件的属性中，设置 "Build Action = Content" 和 "Copy to Output Directory" = "Copy Always"

我将其发布到我的私人 NuGet 库。

然后我将该包添加到我的 Blazor (.Net Core 3.1) 应用程序中。

当我查看 Visual Studio 的解决方案资源管理器时，我看到的看起来很有希望：

/wwwroot/js/myFileFromNugetPackage.js

然而...

如果我在同一目录下手动创建一个新文件，那么我现在有：

/wwwroot/js/manuallyAddedFile.js /wwwroot/js/myFileFromNugetPackage.js

当我转到两个文件的属性时，我看到不同的路径：

C:{some path}\MyApplication\wwwroot\js\manuallyAddedFile.js

和

C:\Users\{me}\.nuget\packages\{myNuGetPackage}\{version}\contentFiles\any\netstandard2.1\wwwroot\js\myFileFromNugetPackage.js

毫不奇怪，当我尝试使用 Blazor 的 JS Interop 使用这些 JS 文件中的任何一个时，我可以使用我手动输入的文件，但它无法从我的 NuGet 包中找到该文件。 F12 开发人员工具仅显示客户端上存在的手动创建的。

所以，我的问题是：如何设置我的 NuGet 项目来编写 JS 文件，以便它最终位于正确的目录中？

Answer 1

And unsurprisingly, when I attempt to use either of those JS file using Blazor's JS Interop, I can use the one I manually entered, but it can't find the one from my NuGet package.

因为您只能在 Blazor 应用程序（新的 SDK 格式）中使用 packagesreference nuget management format，所以您导入包只能通过引用 links 将是以文件的形式将你的文件放入一个包中的项目中，所以 myFileFromNugetPackage。 Js 属性显示在路径 ../. Nuget/packages 中。

这也是pacakgesreference nuget管理格式的一个特点。顺便说一下，packagesconfig nuget management format.

不是这种情况

当你添加一个新的项目时，意味着你已经在你当前的解决方案下创建了一个文件，所以你可以在解决方案下找到新的文件。

I followed one example which used a *.targets file, but it didn't work for me. So, my question is: How do I set up my NuGet project to write a JS file so that it ends up in the correct directory?

解决方案

要解决您的问题，您可以将目标文件添加到 nuget 包中，它将实际文件复制到项目中，以便在主项目中引用它，而不是在 link 中引用它。

我试过你的link演示，它可以成功实现你的目标。核心是这段

 <ItemGroup>
        <SourceScriptFiles Include="$(MSBuildThisFileDirectory)..\content\scriptsToGenerate\*.js" />
    </ItemGroup>
    <Target Name="CopyScriptsToProject" BeforeTargets="Build">
        <Copy SourceFiles="@(SourceScriptFiles)" DestinationFolder="$(ProjectDir)\wwwroot\js\scriptsToGenerate\"
        />
    </Target>

注：

在某些情况下，您可能希望在使用您的包的项目中添加自定义构建目标或属性，例如运行构建期间的自定义工具或过程。为此，您可以将 <package_id>.targets 或 <package_id>.props（例如 Contoso.Utility.UsefulStuff.targets）形式的文件放置在项目的 \build 文件夹中。

这个预处理目标只能在构建时执行，所以我怀疑你在没有构建项目的情况下在主项目中找不到JS文件。希望它能帮助你。

如何在 NuGet 包中包含 JS 文件

How to include a JS file in a NuGet package

visual-studio

nuget

nuget-package

target

.net-standard