管理 npm 包 - Visual Studio (Windows)

基于 CLI 的项目 (.esproj)

从 Visual Studio 2022 预览版 4 开始，npm 包管理器可用于基于 CLI 的项目，因此现在可以采用为 ASP.NET Core 项目下载 NuGet 包的方式下载 npm 模块。然后可以使用 package.json 来修改和删除包。

要打开包管理器，请在解决方案资源管理器中右键单击项目中的 npm 节点。

接下来可以搜索 npm 包，选择一个包，然后选择“安装包”进行安装。

Node.js 项目

对于 Node.js 项目 (.njsproj)，可以执行下列任务：

从解决方案资源管理器安装包

从解决方案资源管理器管理安装的包

在 Node.js 交互式窗口中使用


     .npm

命令

这些功能协同工作，并与项目系统和项目中的 package.json 文件同步。

需要安装“Node.js 开发”工作负载和 Node.js 运行时，以便将 npm 支持添加到项目。有关详细步骤，请参阅创建 Node.js 和 Express 应用。

对于现有的 Node.js 项目，请使用“基于现有 Node.js 代码”解决方案模板或 Open folder (Node.js) 项目类型来在项目中启用 npm 。

从解决方案资源管理器安装包 (Node.js)

对于 Node.js 项目，安装 npm 包的最简单方法是通过 npm 包安装窗口。若要访问此窗口，右键单击项目中的“npm”节点并选择“安装新的 npm 包” 。

在此窗口中可以搜索包、指定选项并安装。

依赖项类型 - 在“标准”、“开发”和“可选”包间进行选择。 “标准”指定包是一个运行时依赖项，而“开发”指定只在开发过程中需要包。

添加到 package.json - 建议。此可配置选项已被弃用。

所选版本 - 选择你想要安装的包版本。

其他 npm 参数 - 指定其他标准参数。例如，可以输入版本值（如


    @~0.8

），安装版本列表中不可用的特定版本。

可以在“输出”窗口的 npm 输出中查看安装进度（若要打开此窗口，请依次选择“视图”>“输出”，或按 Ctrl + Alt + O）。这可能需要一些时间。

可以在搜索查询前添加感兴趣的范围，进而搜索范围内的包，例如键入 @types/mocha 来查找 mocha 的 TypeScript 定义文件。此外，安装 TypeScript 的类型定义时，可以在 npm 参数字段中添加 @ts2.6 ，指定要面向的 TypeScript 版本。

在解决方案资源管理器中管理安装的包 (Node.js)

npm 包显示在解决方案资源管理器中。 “npm”节点下的条目模拟 package.json 文件中的依赖项。

- 已安装并列在 package.json 中

- 已安装但未显式列在 package.json 中

- 未安装但列在 package.json 中

右键单击 npm 节点，执行以下操作之一：

安装新的 npm 包 打开 UI 以安装新的包。

安装 npm 包 运行 npm 安装命令以安装 package.json 中列出的所有包。（运行


    npm install

。）

“更新 npm 包”根据 package.json 中指定的语义版本控制 (SemVer) 范围，将包更新到最新版本。（运行


    npm update --save

。）。通常使用“~”或“^”指定 SemVer 范围。有关详细信息，请参阅 package.json 配置。

右键单击包节点，执行以下操作之一：

安装 npm 包 运行 npm 安装命令以安装 package.json 中列出的所有包版本。（运行


    npm install

。）

“更新 npm 包”根据 package.json 中指定的 SemVer 范围，将包更新到最新版本。（运行


    npm update --save

。）通常使用“~”或“^”指定 SemVer 范围。

卸载 npm 包 卸载包并将其从 package.json 中删除（运行


    npm uninstall --save

。）

若要帮助解决 npm 包的问题，请参阅疑难解答。

在 Node.js 交互式窗口中使用 .npm 命令 (Node.js)

还可在 Node.js 交互式窗口中使用 .npm 命令来执行 npm 命令。若要打开此窗口，请在“解决方案资源管理器”中右键单击项目，然后选择“打开 Node.js 交互窗口”（或按 Ctrl + K、N）。

在窗口中，可以使用如下命令来安装包：

.npm install azure@4.2.3

默认情况下，npm 将在项目的主目录中执行。如果解决方案中有多个项目，请在方括号中指定项目的名称或路径。 .npm [MyProjectNameOrPath] install azure@4.2.3

如果项目不包含 package.json 文件，请使用 .npm init -y 创建含默认条目的新 package.json 文件。

ASP.NET Core 项目

对于 ASP.NET Core 项目之类的项目，可以在项目中集成 npm 支持，并使用 npm 安装包。

向项目添加 npm 支持

使用 package.json 安装包

对于 ASP.NET Core 项目，还可以使用库管理器或 yarn（而非 npm）来安装客户端 JavaScript 和 CSS 文件。

向项目添加 npm 支持 (ASP.NET Core)

如果你的项目尚未包含 package.json 文件，则可以为其添加一个 package.json 文件以启用 npm 支持。

如果你尚未安装 Node.js，建议从 Node.js 网站安装 LTS 版本，以实现与外部框架和库的最佳兼容性。

npm 需要 Node.js。

若要添加 package.json 文件，请在“解决方案资源管理器”中右键单击项目，然后依次选择“添加”>“新项”（或按 Ctrl + Shift + A）。使用搜索框查找 npm 文件，选择“npm 配置文件”，使用默认名称，然后单击“添加”。

如果看不到列出的 npm 配置文件，则不会安装 Node.js 开发工具。可以使用 Visual Studio 安装程序添加“Node.js 开发”工作负载。然后重复执行上一步骤。

在 package.json 的 dependencies 或 devDependencies 部分中添加一个或多个 npm 包。例如，可以向文件添加以下内容：

"devDependencies": {
   "gulp": "4.0.2",
   "@types/jquery": "3.3.33"
保存文件时，Visual Studio 会将包添加到解决方案资源管理器中的“依赖项/npm”节点下  。 如果未显示该节点，请右键单击“package.json”并选择“还原包”   。
在某些情况下，解决方案资源管理器可能无法正确显示已安装 npm 包的状态。 有关详细信息，请参阅疑难解答。
使用 package.json 安装包 (ASP.NET Core)
对于包含 npm 的项目，可以使用 package.json 配置 npm 包。 直接打开 package.json 或右键单击解决方案资源管理器中的 npm 节点，并选择“打开 package.json”。
package.json 中的 IntelliSense 可帮助选择特定版本的 npm 包  。
保存文件时，Visual Studio 会将包添加到解决方案资源管理器中的“依赖项/npm”节点下  。 如果未显示该节点，请右键单击“package.json”并选择“还原包”   。
安装包可能需要几分钟的时间。 通过在“输出”窗口中切换到“npm”输出来查看包的安装进度   。
npm 包疑难解答
npm 需要 Node.js。 如果你尚未安装 Node.js，建议从 Node.js 网站安装 LTS 版本，以实现与外部框架和库的最佳兼容性。
对于 Node.js 项目，必须为 npm 支持安装“Node.js 开发”工作负载  。
在某些情况下，由于此处所述的已知问题，解决方案资源管理器可能无法正确显示已安装 npm 包的状态。 例如，在安装包时，可能会显示为未安装。 在大多数情况下，可以通过删除 package.json，重启 Visual Studio 并重新添加 package.json 文件来更新解决方案资源管理器，如本文前面所述   。 也可在安装包时使用“npm 输出”窗口来验证安装状态。
在某些 ASP.NET Core 方案中，在生成项目后，解决方案资源管理器中的 npm 节点可能不可见。 若要使节点再次可见，请右键单击项目节点，然后选择“卸载项目”。然后右键单击项目节点，并选择“重新加载项目”。
如果在生成应用或转译 TypeScript 代码时看到任何错误，请检查 npm 包是否由于潜在错误源而不兼容。 若要帮助识别错误，请在安装包时检查“npm 输出”窗口，如本文前面所述。 例如，如果所使用的一个或多个 npm 包版本是已弃用的版本，并导致发生错误，则可能需要安装较新版本以消除错误。 有关使用 package.json  控制 npm 包版本的信息，请参阅 package.json 配置。