npm、pnpm 和 Yarn
JetBrains Rider 集成了 npm、 pnpm、 Yarn、 Yarn 2 和 Yarn 3,因此您可以在 IDE 的内置 终端中安装、定位、更新和移除可重用代码的包。
JetBrains Rider 同样允许您运行和调试 npm、Yarn 和 pnpm 脚本。 JetBrains Rider 分析 package.json 文件,识别脚本定义,以树状视图显示脚本,并允许您在树中的脚本和 package.json 文件中的定义之间导航。 如需更多信息,请参阅 npm、 Yarn 和 pnpm 官方网站。
JetBrains Rider 侦测到含有 Yarn workspaces 的项目,并索引列在工作区的 package.json 文件中但位于根 node_modules 文件夹中的所有依赖项。
在开始之前
下载并安装 Node.js。 请注意,npm 也已安装,因此如果您打算使用它,那么预备步骤就完成了。
要使用 Yarn,请按照 Yarn 官方网站上的说明进行安装。
要使用 pnpm,请打开嵌入式 终端 (Alt+F12 )并输入:
npm install --g pnpm进一步了解请访问 pnpm official website。
选择项目包管理器
通过 JetBrains Rider,您可以选择在项目中使用 npm、Yarn、Yarn 2 或 pnpm。
默认情况下,JetBrains Rider 建议使用 npm。 但是,如果您打开了一个包含 yarn.lock 文件的项目,并且您的计算机上安装了 Yarn,JetBrains Rider 会自动将该项目的包管理器更改为 Yarn。
因此,如果您打开一个带有 pnpm-lock 文件的项目,并且您的计算机上安装了 pnpm,JetBrains Rider 会自动将此项目的包管理器改为 pnpm。
您还可以 将 Yarn 1 或 pnpm 设置为默认的 JetBrains Rider 包管理器。
在 设置/首选项 对话框(Ctrl+Alt+S )中,前往 。 Node.js 页面打开。
在 包管理器 字段中,指定您的项目的包管理器。

选择 npm、 yarn 或 pnpm 以使用系统默认安装。
要使用自定义安装的包管理器,请点击 选择 ,然后选择相关包管理器的安装文件夹。

JetBrains Rider 会在您从
项目别名列表中选择 包管理器 时,自动使用所选的软件包管理器 运行/调试配置:NPM 对话框。 JetBrains Rider 还会在每次调用 运行 'npm install'/运行 'yarn install'/运行 'pnpm install' 命令或运行 npm/Yarn/pnpm 脚本时使用所选包管理器的路径。 如需更多信息,请参阅 运行和调试脚本。
在您的项目中设置 Yarn 2
请确保在全局安装 Yarn 1,并按照 Yarn 官网中的说明在您的项目中启用 Yarn 2。 请使用嵌入的 终端 Alt+F12 输入命令。
在 设置/首选项 对话框 (Ctrl+Alt+S) 中,转到 并从 包管理器 列表中选择项目中 Yarn 2 包的路径。
将 Yarn 1 或 pnpm 设置为 JetBrains Rider 的默认包管理器
打开 新项目设置 对话框( ),然后转到 。
在打开的 Node.js 和 NPM 页面上,从 包管理器 列表中选择
yarn或pnpm。
之后,JetBrains Rider 每次您创建新项目时都会建议将所选的软件包管理器 (Yarn 或 pnpm) 设为默认选项。
编辑 package.json
JetBrains Rider 帮助您管理 package.json 文件中的项目依赖,提供广泛的编码支持。
包名的代码补全。

有关最新可用包版本的信息。

关于可通过
npm install <package>@<version>或yarn add <package>@<version>安装的版本作用域的信息。 `请注意,运行npm install或yarn install将安装此作用域内可用的最新版本。按 Ctrl ,然后将鼠标悬停在版本上,以在工具提示中查看信息。 请参阅 npm 官方文档了解有关语义版本的详细信息。

指示指定的包版本是否已安装以及有关最新可用版本的信息。

以前版本包的代码补全。 当您按 Ctrl+Space 或开始输入与最新版本不同的版本时,JetBrains Rider 会显示包含该软件包所有先前版本的建议列表。

快速查看包的文档。

安装和更新包
众所周知,npm 可以安装软件包,无论是 全局还是作为 项目依赖或 开发依赖 ,了解更多信息请访问 npm 官方网站。
pnpm 还会将软件包 全局或作为 项目依赖项或 开发依赖项进行安装,更多信息请参阅 pnpm 官方网站。
使用 Yarn,您可以安装软件包 全局或作为 项目依赖项。 如需更多信息,请参阅 Yarn 官方网站。
在 JetBrains Rider 中,可以在编辑器中、从一个 package.json 文件中、在内置的 终端 Alt+F12 中或在 Node.js 页面上安装软件包。
从 package.json
安装您的项目依赖项
在弹出窗口中点击 运行 'npm install'、 运行 'yarn install' 或 运行 'pnpm install' 链接:

JetBrains Rider 当依赖项尚未安装或已更改时,会显示此弹出窗口。 如果您关闭弹出窗口或通过选择 不再询问 将其关闭,您仍然可以使用 运行 '<package manager> install' 操作或 在内置终端中安装依赖项。
如果 JetBrains Rider 无法检测到 Node.js 解释器,则会在弹出窗口中报告错误,并提供一个链接到 Node.js 页面,您可以在该页面 配置 Node.js 解释器。

如果您不小心关闭了此通知,现在想要恢复它,请按 Ctrl+Shift+A ,开始输入
启用通知,然后从列表中选择 Enable Notifications about Installing Dependencies from package.json。或者,您可以在编辑器中打开相关的 package.json 文件或在 项目 工具窗口中选择它,然后从上下文菜单中选择 运行 'npm install'。
更新您的项目依赖项
请在弹出窗口中点击 运行 '<package manager> install'。

JetBrains Rider 每次您打开项目、从版本控制中更新项目或编辑 package.json 时,都会显示此弹窗。
JetBrains Rider 还会运行一个检查,检查
依赖关系或开发依赖的包是否已安装及其版本是否符合指定作用域。 如果检查检测到任何不匹配,将建议快速修复。 要应用它,请点击 运行 '<package manager> install' 链接。
JetBrains Rider 还会检测可用的较新版本的软件包,并在您将鼠标悬停在软件包版本上时提供快速修复。

或者,按 Alt+Enter 并从列表中选择 将 <package> 更新到最新版本:

在内置终端中
在嵌入式 终端 (Alt+F12) 中,输入以下命令之一:
全局安装:
npm install --global <package_name>yarn global add <package_name>pnpm --global add <package_name>
将软件包安装为项目依赖项或开发依赖项:
"""
npm install --save <package_name>或npm install --save-dev <package_name>"""yarn add <package_name> --devpnpm add --save-dev <package_name>
安装 package.json 文件中列出的所有依赖项
在嵌入式 终端 (Alt+F12) 中,输入以下命令之一:
npm installyarn installpnpm install
因此,您将从当前文件夹中获取 package.json 中列出的所有依赖项。 了解更多信息,请参阅 编辑 package.json。
检测漏洞包
JetBrains Rider detects vulnerabilities in the packages used in your projects by checking across the Mend.io Vulnerability Database and the National Vulnerability Database. 当您编写代码时,IDE 会高亮显示被认为脆弱的包,为它们提供描述,并在可用时建议修复措施。 整个检测到的漏洞包列表显示在 问题 工具窗口中。
漏洞检查由依赖于 Vulnerable declared dependency 代码检查 的 Package Checker 插件处理。 The plugin is powered by Mend.io. 该插件与 JetBrains Rider 捆绑并默认启用。 如果相关功能不可用,请确保您没有禁用插件。 欲了解更多信息,请参阅 启用插件设置。

在编辑器中解决包的漏洞问题
将鼠标悬停在 package.json 文件中高亮显示的包上。 弹出工具窗口显示检测到的漏洞描述。
要应用快速修复,请点击 更多操作 Alt+Enter 并选择相关建议。
在 “Problems” 工具窗口中查看易受攻击的包
请点击
查看检查小组件。
问题 工具窗口 文件 选项卡列出了活动编辑器选项卡中打开的 package.json 中所有的漏洞包 每个项目都附有描述。
要解决问题,请在列表中选择漏洞包,点击工具栏上的
或按 Alt+Enter ,然后选择相关建议。存在漏洞的依赖项 选项卡列出了在您的项目中检测到的所有易受攻击的软件包。

要解决问题,请在列表中选择漏洞包,点击右侧窗格中的 复制安全版本到剪贴板 链接,然后将复制的版本粘贴到您的 package.json 。
禁用软件包漏洞检查
默认情况下,软件包漏洞检查已启用。
要将其关闭,请打开 设置/首选项 对话框(Ctrl+Alt+S ),转到 ,并清除 安全性 节点下 易受攻击的声明依赖项 检查旁边的复选框。
或者,打开 设置/首选项 对话框(Ctrl+Alt+S ),转到 ,找到 软件包检查器 插件,然后点击 禁用。
运行和调试脚本
您可以从编辑器中的 package.json 文件,从专用的 npm 工具窗口中的脚本树,根据专用运行配置,或者自动地以 start-up 或 before-launch 任务运行 npm、Yarn 或 pnpm 脚本。
脚本执行的结果显示在 Run tool window。 工具窗口显示 npm 或 Yarn 脚本输出,报告发生的错误,列出未找到的包或插件等。 最后执行的脚本名称显示在工具窗口的标题栏上。
如果您启动脚本调试会话,JetBrains Rider 会打开 调试工具窗口 ,您可以在其中 逐步执行脚本、 停止和恢复 脚本执行、 在暂停时检查脚本、 在调试器控制台中运行 JavaScript 代码片段 等。
从 package.json 运行和调试脚本
JetBrains Rider 让您能够快速启动 package.json 文件中的单个脚本。 要运行或调试多个脚本,请使用运行配置或 npm 工具窗口。
在编辑器中打开相关 package.json 文件,点击脚本旁边的空隙中的
,然后从上下文菜单中选择 运行 <script_name> 或 调试 <script_name>。

您也可以按 Ctrl+Shift+F10 运行脚本。
脚本输出显示在 运行 工具窗口中。
如果您以调试模式启动脚本,JetBrains Rider 会打开 调试工具窗口 ,您可以在其中 逐步执行脚本、 停止和恢复脚本执行、 在暂停时检查脚本 ,以及 在调试器控制台中运行 JavaScript 代码片段 等。
从 npm 工具窗口运行和调试脚本
当您在 资源管理器 工具窗口 Alt+1 中选择 package.json 文件或在编辑器中打开它并从上下文菜单中选择 显示 npm 脚本 时, npm 工具窗口会打开。
您一旦调用 npm、pnpm 或 Yarn,该工具就会开始构建一个在 scripts 属性中定义的脚本树,并且是在调用它的 package.json 文件上构建。
如果在项目中有多个 package.json 文件,您可以为每个文件构建一个单独的脚本树,并在不删除先前构建的树的情况下运行脚本。 每棵树显示在一个单独的节点下。
如果 npm 工具窗口尚未打开,请将其打开
在 资源管理器 工具窗口 Alt+1 中选择所需的 文件,或在编辑器中打开它并从上下文菜单中选择 显示 npm 脚本。

npm 工具窗口将打开,其中显示根据选定或打开的 package.json 文件构建的脚本树。
在已打开的 npm 工具窗口中构建脚本树
在 npm 工具窗口中,点击
工具栏,然后从列表中选择所需的 package.json 文件。 默认情况下,JetBrains Rider 会在项目的根目录中显示 package.json 文件。
如果您有另一个 package.json 文件,请点击 选择 package.json 并在打开的对话框中选择所需的 package.json 文件。 JetBrains Rider 添加一个新节点,该节点的标题包含所选 package.json 文件的路径,并在新节点下构建脚本树。

重新构建树
切换到所需节点并在工具栏上点击
。
按名称对树中的脚本进行排序
点击
工具栏上的图标,从菜单中选择 排序方式 ,然后选择 名称。
默认情况下,树会按在 package.json 中定义的顺序显示脚本(选项 定义顺序)。
运行一个脚本
双击该脚本。
在树中选择脚本并按下 Enter 或从上下文菜单中选择 运行 <script name>。
调试一个脚本
在树中选择脚本,并从上下文菜单中选择 调试 <script_name>。
JetBrains Rider 打开 调试工具窗口 ,您可以在其中 逐步执行脚本、 停止和恢复脚本执行、 在暂停时检查脚本 ,以及 在调试器控制台中运行 JavaScript 代码片段 等。
运行或调试多个脚本
使用多选模式:按住 Shift (用于相邻的项目)或 Ctrl (用于非相邻的项目)键并选择所需的脚本,然后从选择的上下文菜单中选择 运行 或 调试。

通过运行配置运行和调试脚本
当您从编辑器或 npm 工具窗口运行或调试脚本时,JetBrains Rider 会自动创建 临时运行配置。 除了使用它们,您还可以创建并启动您自己的 npm run 配置。
创建一个 NPM 运行/调试配置
转到 。 或者,从工具栏的 运行 小部件中选择 编辑配置。

在打开的 编辑配置 对话框中,单击工具栏上的 添加 按钮(
),然后从列表中选择 npm。 运行/调试配置:npm 对话框 打开。
指定要执行的 CLI 命令、要运行的脚本(使用空格作为分隔符),以及定义这些脚本的 package.json 文件的位置。 可选地,键入执行脚本的 command-line arguments。
指定要使用的 Node.js 解释器。
如果您选择 项目 别名,JetBrains Rider 将自动使用 Node 解释器 字段中 Node.js 页面的项目默认解释器。 在大多数情况下,JetBrains Rider 会检测到项目的默认解释器并自动填写该字段。
您也可以选择另一个已配置的本地或远程解释器,或点击
并配置一个新的。
可选地指定 Node.js 特定的选项形参和传递给 Node.js 的 环境变量。
指定要使用的软件包管理器。 如果您选择
项目别名,JetBrains Rider 将使用 Node.js 页面中的默认项目包管理器。 您还可以选择相关的软件包别名(npm 或 yarn )或指定自定义安装的软件包管理器的显式路径。如果您在 Docker 容器中使用远程 Node.js 解释器,请检查 Docker 容器设置 字段中的端口和卷绑定值。

了解更多有关软件包管理器的命令行界面的信息,请访问 npm official website和 Yarn official website。
运行并调试您的脚本
从工具栏的 运行 小部件中,选择新创建的运行配置,然后点击旁边的
或
。
脚本执行的结果显示在 Run tool window。
如果点击
,JetBrains Rider 会打开 调试工具窗口 ,您可以在其中 逐步执行脚本、 停止和恢复 脚本执行、 暂停时检查 脚本,以及 在调试器控制台中运行 JavaScript 代码片段。
使用 "运行一切" 运行脚本
运行一切 是启动脚本的快捷方式。
按 Ctrl 两次或点击导航栏上的
。 Run Anything(运行任何内容) 弹出窗口打开了。
在搜索字段中输入
npm run或yarn run。 在您输入时,JetBrains Rider 会显示匹配的脚本。 从列表中选择所需的一个,然后按 Enter。
若要在 运行 工具窗口中查看命令输出,请按 Ctrl+Enter ,若要在 调试 工具窗口中显示输出,请按 Shift+Enter。

在启动时自动运行脚本
如果您有一些脚本需要定期运行,您可以将相应的 run configurations 添加到 startup tasks 列表中。 任务将在项目启动时自动执行。
在 设置/首选项 对话框 (Ctrl+Alt+S) 中,前往 。
在打开的 启动任务页面上,点击工具栏上的
。
从列表中选择所需的 npm 运行配置。 配置已添加到列表中。
如果项目中没有可用的适用配置,请点击
并选择 编辑配置。 然后在打开的 Run/Debug configuration页面上定义具有所需设置的配置。 当您保存新配置时,它会自动添加到启动任务列表中。
将脚本作为启动前的任务运行
通过从主菜单中选择 打开 运行/调试配置对话框 对话框,并从列表中选择所需配置,或通过点击
然后选择相关运行配置类型来重新创建它。
在打开的对话框中,点击
区域中的 启动前 ,并从列表中选择 运行 npm 脚本。
在 NPM Script 对话框中,指定 npm run/debug configuration settings。
在 Docker 中使用 npm、pnpm 和 yarn
有了 JetBrains Rider,您可以编辑 package.json ,安装、更新和移除 Docker 容器中项目的依赖项,就像在本地操作一样。
确保在 设置 | 插件 页面的 已安装 选项卡上启用了所需的 Node.js、 Node.js Remote Interpreter和 Docker插件。 如需更多信息,请参阅 插件管理。
下载、安装并配置 Docker ,如 Docker 中所述
在 Docker 中配置 Node.js 远程解释器或通过 Docker Compose并 将其设置为默认在您的项目中。 还要确保与此远程解释器关联的软件包管理器 设置为项目默认。
与本地开发一样进行操作: 编辑您的 package.json, 管理项目依赖项 ,并 运行或调试脚本。