将 jquery 包添加到 Angular 10+ 项目的正确方法？

Question

我正在尝试将 jquery 和 jquery-slimscroll 包安装到 Angular 项目（版本 > 10），但这些包似乎没有正确安装。那么，关于这个问题，能否请您澄清一下以下问题？

假设我有以下客户端结构：

ClientApp ---
            |--- node_modules
            |--- package.json
            |--- angular.json

1.在项目中添加jquery和jquery-slimscroll的正确方法是什么？

我应该在 ClientApp 文件夹上运行 npm install 吗？或者对于最新的 Angular 版本有更好的方法吗？

2.我认为有几种方法可以将这些包添加为脚本，如下所示：

在angular.json:

"scripts": [
  ".../jquery/dist/jquery.min.js",
  ".../jquery-slimscroll/jquery.slimscroll.js",
]

这样添加它们不是一个好方法吗？我应该像第一个问题一样将它们添加到 npm 中吗？

3.packages.json 呢？一些包被添加到packages.json 而不是angular.json。有什么区别，为什么有些包要加另一个？

Answer 1

首先你要了解angular.json和package.json的作用。

Angular.json

Angular 工作空间根级别的名为 angular.json 的文件 提供工作区范围和项目特定的配置默认值 用于 Angular CLI 提供的构建和开发工具。小路 配置中给出的值是相对于根工作区的 文件夹。

Package.json

最初，这个 package.json 包含一组初始包，其中一些 其中 Angular 和其他支持常见的 应用场景。您将包添加到 package.json 作为您的 应用程序发展。你甚至可以删除一些。

package.json 被组织成两组包：

依赖项对于运行应用程序至关重要。开发依赖 只需要开发应用程序。

因此，对于添加这些 jquery 依赖项的正确方法的问题，您可以同时执行 npm install jquery 或添加到 package.json 以及如果需要添加到 angular.json。

两种方式的不同之处在于，如果您使用npm install jquery，它会自动添加依赖项并将包下载到您的node_modules，您手动添加它，无论如何您都需要运行npm install，tp get the包。