我错过了什么（第一次 Yarn 用户 + JQuery）

Question

所以我只是尝试使用 Yarn 将 JQuery 运行时添加到 .NET Core 网站项目中。

我在项目文件夹中运行的命令是：

  yarn add jquery --modules-folder ./root/scripts

它确实添加了 jQuery（到指定的子文件夹），但它添加的方式比我预期的要多。使用 Nuget，我会得到：

  jquery-3.3.1.js
  jquery-3.3.1.min.js
  jquery-3.3.1.min.map

即使 Nuget 不会将文件添加为站点内容（尽管我可以只复制它们），但我会拥有我需要的东西。但是使用 Yarn，我得到了一个完整的源代码库：

共有 123 个文件（dist 中的文件甚至没有标记版本号）。

这是预期的结果吗...我使用 Yarn 是否错误（概念上）？

我是否应该将构建 JQuery 作为我项目的一部分，而不是仅仅包含和使用它？

Answer 1

Marko 的描述（以及那张很棒的图表）很好地解释了正在发生的事情。为了回答有关解决它的问题，从 Gulp 到 WebPack 有一系列令人眼花缭乱的潜在选择。

但是，对于像复制几个 javascript 库这样简单的事情，我建议使用基本的 BuildBundlerMinifier，它已经包含在 ASP.NET 中很长一段时间了。

默认的 ASP.NET Core 2.0 模板包括开箱即用的部分支持，但您确实需要对项目进行一些更改才能正常工作：

1. 在您的.csproj 文件中，您需要为BuildBundlerMinifier 添加一个包引用。您将把它添加到相同的<ItemGroup> 中作为对Microsoft.AspNetCore.All 的引用。这将启用捆绑器并使其在构建期间启动。

   <ItemGroup>
     <PackageReference Include="Microsoft.AspNetCore.All" Version="2.0.3" />
     <PackageReference Include="BuildBundlerMinifier" Version="2.6.362" />
   </ItemGroup>
   

2. 正如我所提到的，标准模板部分支持捆绑器。我的意思是它默认在项目的根目录中包含一个bundleconfig.json 文件。该文件配置捆绑器触及哪些文件。如果您要查找的只是jquery-3.3.1.min.js，那么您的文件应该如下所示：

   [
     {
       "outputFileName": "root/scripts/jquery.min.js",
       "inputFiles": [
         "node_modules/jquery/dist/jquery.min.js"
       ],
       "minify": {
         "enabled": false
       }
     }
   ]
   

这里的最终结果是，每次构建项目时，捆绑程序都会自动将 jquery.min.js 从 node_modules/jquery/dist/ 复制到 root/scripts/。

如果您使用 Yarn，我也强烈推荐 Yarn.MSBuild 库。此包使 MSBuild 能够在构建期间自动检索您的 Yarn 包。与捆绑器结合使用时，这可确保您每次构建时在 /scripts 文件夹中拥有最新的软件包副本。

Answer 2

这就是yarn，或者更准确地说是npm，yarn 用作模块存储库的工作原理。

它并不仅仅安装库。它安装已发布的整个软件包。通常，发布者不会努力省略已发布版本中的某些文件，而您基本上可以获得整个存储库。这包括预期的库文件，以及文档、原始源代码、测试等。

这就是为什么这张关于node_modules 的图片对于那些在生活中的某个时刻不得不使用npm 的人来说很有趣的原因：

回答你的问题：不，你没有用错。它按预期工作，虽然看起来很奇怪。

如果您只想要特定文件，最好的办法是使用yarn 安装，然后将文件复制过来。但请注意，如果您更新软件包版本，文件的目的地可能会发生变化，因此请记住这一点。