# npm、pnpm 和 Yarn

> For the complete documentation index, see [llms.txt](https://www.jetbrains.com/zh-cn/help/idea/llms.txt).

IntelliJ IDEA 可与 [npm](https://docs.npmjs.com/)、 [pnpm](https://pnpm.io)、 [Yarn](https://classic.yarnpkg.com/lang/en/)、 [Yarn 2](https://yarnpkg.com/getting-started)、 Yarn 3 以及 [Bun](https://bun.sh/) 集成。 因此，您可以在 IDE 内置的 [Terminal](terminal-emulator.html) 中安装、定位、更新和移除可重用代码的包。

IntelliJ IDEA 同样允许您运行和调试 npm、Yarn 和 pnpm 脚本。 IntelliJ IDEA 分析  `package.json`  文件，识别脚本定义，以树状视图显示脚本，并允许您在树中的脚本和  `package.json`  文件中的定义之间导航。 如需更多信息，请参阅 [npm](https://docs.npmjs.com/misc/scripts)、 [Yarn](https://classic.yarnpkg.com/en/docs/cli/run/) 和 [pnpm](https://pnpm.io/cli/run) 官方网站。

> **Warning:**
> 调试脚本仅在 旗舰版 版本中受支持。

IntelliJ IDEA 会检测包含 [Yarn 工作区](https://yarnpkg.com/features/workspaces#) 的项目，并在项目分析期间索引列在工作区的  `package.json`  文件中但位于根  `node_modules`  文件夹中的所有依赖项。

## 开始之前

Procedure:

* 下载并安装 [Node.js](http://nodejs.org/#download)。 请注意，npm 也已安装，因此如果您打算使用它，那么预备步骤就完成了。

* 要使用 Yarn，请按照 [Yarn 官方网站](https://yarnpkg.com/getting-started/install)上的说明进行安装。

* 要使用 pnpm，请打开命令行 shell 或嵌入式   终端  （ `Alt+F12` (Windows), `⌥ F12` (macOS), `⌥ F12` (IntelliJ IDEA Classic (macOS)), `⌘ ⌃ T` (macOS System Shortcuts), `Alt+F12` (XWin), `Alt+F12` (GNOME), `Alt+F12` (KDE), `Alt+F12` (Emacs), `Alt+F12` (Sublime Text), `⌥ F12` (Sublime Text (macOS)), `Ctrl+Alt+1` (Visual Studio), `⌘ ⌃ 1` (Visual Studio (macOS)), `Alt+F12` (NetBeans), `Alt+F12` (Eclipse), `⌥ F12` (Eclipse (macOS))），然后输入：

`npm install --g pnpm`

进一步了解请访问 [pnpm official website](https://pnpm.io/installation)。

* 要使用 Bun，请按照 [Bun 官方网站](https://bun.sh/docs/installation) 上的说明进行安装。

## 选择项目包管理器

通过 IntelliJ IDEA，可以选择在项目中使用 npm、Yarn、Yarn 2、Bun 或 pnpm。

默认情况下，IntelliJ IDEA 建议使用 npm。 但是，如果您打开的项目包含  `yarn.lock`  文件，并且您的计算机上已安装 Yarn，IntelliJ IDEA 会自动将该项目的包管理器更改为 Yarn。

同理，如果您打开的项目包含  `pnpm-lock`  文件，并且您的计算机上已安装 pnpm，IntelliJ IDEA 会自动将该项目的包管理器更改为 pnpm。

如果您的项目包含  `bun.lock`  或  `bun.lockb`  文件，并且您的计算机上已安装 Bun，IntelliJ IDEA 会建议您在当前项目中改用 Bun 而非 npm。

您还可以 [将 Yarn 1 或 pnpm 设为 IntelliJ IDEA 的默认包管理器](#ws_npm_yarn_set_yarn_default)。

Procedure:

1. 在   设置   对话框（ `Ctrl+Alt+S` (Windows), `⌘ Comma` (macOS), `⌘ Comma` (IntelliJ IDEA Classic (macOS)), `⌘ Comma` (macOS System Shortcuts), `Ctrl+Alt+S` (XWin), `Ctrl+Alt+S` (GNOME), `Ctrl+Alt+S` (KDE), `Ctrl+Alt+S` (Emacs), `Ctrl+Alt+S` (Sublime Text), `⌘ Comma` (Sublime Text (macOS)), `Ctrl+Alt+S` (Visual Studio), `⌘ Comma` (Visual Studio (macOS)), `Ctrl+Alt+S` (NetBeans), `Ctrl+Alt+S` (Eclipse), `⌘ Comma` (Eclipse (macOS))），转到  `语言与框架 | JavaScript 运行时` 。 将打开 [JavaScript 运行时](javascript-runtime.html) 页面。

2. 在   包管理器  字段中，指定您的项目的包管理器。

![选择项目包管理器：选择系统默认安装](https://resources.jetbrains.com/help/img/idea/2026.3/ws_package_manager_configuration_select_package_manager.png)

* 选择 npm 、 yarn 、 pnpm 或 Bun 以使用系统默认安装。 > **Tip:** > IntelliJ IDEA 使用 `npm` 、 `yarn` 、 `pnpm` 和 `Bun` 别名来指向这些管理器的当前系统路径。 如果选择另一个 Node.js 版本，IntelliJ IDEA 还会更改别名路径，使其指向与所选 Node.js 版本捆绑的软件包管理器版本。

* 要使用自定义安装的包管理器，请点击 选择 ，然后选择相关包管理器的安装文件夹。 ![选择项目包管理器：选择自定义安装](https://resources.jetbrains.com/help/img/idea/2026.3/调试配置：NPM](run-debug-configuration-npm.html) 对话框。 IntelliJ IDEA 还会在每次调用   运行 'npm install'  /   运行 'yarn install'  /   运行 'pnpm install'   命令或运行 npm/Yarn/pnpm 脚本时使用所选包管理器的路径。 如需更多信息，请参阅 [运行和调试脚本](#ws_npm_running_npm_scripts)。

Procedure: 为新项目设置默认 IntelliJ IDEA 软件包管理器的设置设为默认值

1. 打开   新项目设置   对话框（  `文件 | 新建项目设置 | 新项目的 设置` ），然后转到  `语言与框架 | JavaScript 运行时` 。

2. 在打开的   Node.js 和 NPM   页面上，从列表中选择所需的包管理器。

之后，每次创建新项目时，IntelliJ IDEA 都会建议将所选软件包管理器作为默认值。

Procedure: 在您的项目中设置 Yarn 2

1. 请确保在全局安装 Yarn 1，并按照 [Yarn 官网](https://yarnpkg.com/getting-started/install)中的说明在您的项目中启用 Yarn 2。 请使用嵌入的   终端   `Alt+F12` (Windows), `⌥ F12` (macOS), `⌥ F12` (IntelliJ IDEA Classic (macOS)), `⌘ ⌃ T` (macOS System Shortcuts), `Alt+F12` (XWin), `Alt+F12` (GNOME), `Alt+F12` (KDE), `Alt+F12` (Emacs), `Alt+F12` (Sublime Text), `⌥ F12` (Sublime Text (macOS)), `Ctrl+Alt+1` (Visual Studio), `⌘ ⌃ 1` (Visual Studio (macOS)), `Alt+F12` (NetBeans), `Alt+F12` (Eclipse), `⌥ F12` (Eclipse (macOS)) 输入命令。

2. 在   设置   对话框 ( `Ctrl+Alt+S` (Windows), `⌘ Comma` (macOS), `⌘ Comma` (IntelliJ IDEA Classic (macOS)), `⌘ Comma` (macOS System Shortcuts), `Ctrl+Alt+S` (XWin), `Ctrl+Alt+S` (GNOME), `Ctrl+Alt+S` (KDE), `Ctrl+Alt+S` (Emacs), `Ctrl+Alt+S` (Sublime Text), `⌘ Comma` (Sublime Text (macOS)), `Ctrl+Alt+S` (Visual Studio), `⌘ Comma` (Visual Studio (macOS)), `Ctrl+Alt+S` (NetBeans), `Ctrl+Alt+S` (Eclipse), `⌘ Comma` (Eclipse (macOS))) 中，转到  `语言与框架 | JavaScript 运行时`  并从   包管理器   列表中选择项目中 Yarn 2 包的路径。

## 编辑 package.json

IntelliJ IDEA 帮助您管理  `package.json` 文件中的项目依赖，提供广泛的编码支持。

Procedure:

* 包名的代码补全。

![包名代码补全](https://resources.jetbrains.com/help/img/idea/2026.3/ws_npm_yarn_package_json_completion_for_package.png)

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

![显示最新的可用包版本](https://resources.jetbrains.com/help/img/idea/2026.3/ws_npm_yarn_package_json_latest_version_for_package.png)

* 关于可通过  `npm install <package>@<version>`  或  `yarn add <package>@<version>`  安装的版本范围的信息。 `请注意，运行  `npm install`  或  `yarn install`  将安装此范围内的最新可用版本。

按 `Ctrl` (Windows), `Ctrl` (macOS), `Ctrl` (IntelliJ IDEA Classic (macOS)), `Ctrl` (macOS System Shortcuts), `Ctrl` (XWin), `Ctrl` (GNOME), `Ctrl` (KDE), `Ctrl` (Emacs), `Ctrl` (Sublime Text), `Ctrl` (Sublime Text (macOS)), `Ctrl` (Visual Studio), `Ctrl` (Visual Studio (macOS)), `Ctrl` (NetBeans), `Ctrl` (Eclipse), `Ctrl` (Eclipse (macOS))，然后将鼠标悬停在版本上，以在工具提示中查看信息。 请参阅 [npm 官方文档](https://docs.npmjs.com/about-semantic-versioning)了解有关语义版本的详细信息。

![显示可用软件包版本的范围](https://resources.jetbrains.com/help/img/idea/2026.3/ws_npm_semver.png)

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

![显示包版本是否已安装的信息](https://resources.jetbrains.com/help/img/idea/2026.3/ws_npm_package_json_popup_not_installed.png)

* 以前版本包的代码补全。 当您按 `Ctrl+Space` (Windows), `⌃ Space` (macOS), `⌃ Space` (IntelliJ IDEA Classic (macOS)), `⌃ Space` (macOS System Shortcuts), `Ctrl+Space` (XWin), `Ctrl+Space` (GNOME), `Ctrl+Space` (KDE), `Alt+/` (Emacs), `Ctrl+Space` (Sublime Text), `⌃ Space` (Sublime Text (macOS)), `Ctrl+Space` (Visual Studio), `⌃ Space` (Visual Studio (macOS)), `Ctrl+Space` (NetBeans), `Ctrl+Space` (Eclipse), `⌃ Space` (Eclipse (macOS)) 或开始输入与最新版本不同的版本时，IntelliJ IDEA 会显示包含该软件包所有先前版本的建议列表。

![为以前的包版本提供代码补全](https://resources.jetbrains.com/help/img/idea/2026.3/ws_npm_yarn_package_json_completion_for_earlier_package_versions.png)

* 快速查看包的文档。

![包的快速文档查询](https://resources.jetbrains.com/help/img/idea/2026.3/ws_npm_yarn_package_json_quick_doc_for_package.png)

> **Tip:**
> IntelliJ IDEA 还会在您从  `require`  或  `import`  语句调用文档查找时显示  `readme`  文件中的 npm 包。

## 安装和更新包

众所周知，npm 可以安装软件包，无论是 [全局](https://docs.npmjs.com/getting-started/installing-npm-packages-globally)还是作为  项目依赖 或  开发依赖 ，了解更多信息请访问 [npm 官方网站](https://docs.npmjs.com/cli-commands/install.html)。

pnpm 还会将软件包  全局 或作为  项目依赖项 或  开发依赖项 进行安装，更多信息请参阅 [pnpm 官方网站](https://pnpm.io/cli/add#options)。

使用 Yarn，您可以安装软件包 [全局](https://yarnpkg.com/en/docs/cli/global)或作为  项目依赖项 。 如需更多信息，请参阅 [Yarn 官方网站](https://yarnpkg.com/en/docs/cli/install)。

在 IntelliJ IDEA 中，您可以在编辑器中、从  `package.json`  文件、在内置的   终端   `Alt+F12` (Windows), `⌥ F12` (macOS), `⌥ F12` (IntelliJ IDEA Classic (macOS)), `⌘ ⌃ T` (macOS System Shortcuts), `Alt+F12` (XWin), `Alt+F12` (GNOME), `Alt+F12` (KDE), `Alt+F12` (Emacs), `Alt+F12` (Sublime Text), `⌥ F12` (Sublime Text (macOS)), `Ctrl+Alt+1` (Visual Studio), `⌘ ⌃ 1` (Visual Studio (macOS)), `Alt+F12` (NetBeans), `Alt+F12` (Eclipse), `⌥ F12` (Eclipse (macOS)) 中，或在 [JavaScript 运行时](javascript-runtime.html) 页面上安装软件包。

### 从 package.json

Procedure: 安装您的项目依赖项

* 在弹出窗口中点击   运行 'npm install'  、   运行 'yarn install'   或   运行 'pnpm install'   链接：

![安装依赖弹出窗口](https://resources.jetbrains.com/help/img/idea/2026.3/ws_npm_yarn_package_run_npm_install_package_json_dependent.png)

IntelliJ IDEA 当依赖项尚未安装或已更改时，会显示此弹出窗口。 如果您关闭弹出窗口或通过选择   不再询问  将其关闭，您仍然可以使用   运行 '<package manager> install'  操作或 [在内置终端](#ws_npm_install_all_dependencies)中安装依赖项。

如果 IntelliJ IDEA 无法检测到 Node.js 运行时，将在弹出窗口中报告该错误，并提供指向 [JavaScript 运行时环境](javascript-runtime.html) 页面的链接，您可以在该页面中 [配置 Node.js 解释器](http://localhost:63343/JetBrains+Desktop+Products/preview/developing-node-js-applications.html#ws_node_configure_local_node_interpreter)。

![未找到 Node.js](https://resources.jetbrains.com/help/img/idea/2026.3/npm_install_from_package_json_node_not_found.png)

如果您不小心关闭了此通知，现在想要恢复它，请按 `Ctrl+Shift+A` (Windows), `⌘ ⇧ A` (macOS), `⌘ ⇧ A` (IntelliJ IDEA Classic (macOS)), `⌘ ⇧ P` (macOS System Shortcuts), `Ctrl+Shift+A` (XWin), `Ctrl+Shift+A` (GNOME), `Ctrl+Shift+A` (KDE), `Escape, X` (Emacs), `Ctrl+Shift+P` (Sublime Text), `⌘ ⇧ P` (Sublime Text (macOS)), `Ctrl+Shift+A` (Visual Studio), `⌘ ⇧ A` (Visual Studio (macOS)), `Ctrl+I` (NetBeans), `Ctrl+Shift+A` (Eclipse), `⌘ 3` (Eclipse (macOS)) ，开始输入  `启用通知`  ，然后从列表中选择   启用有关从 package.json 安装软件包依赖的通知。   。

* 或者，您可以在编辑器中打开相关的  `package.json`  文件或在   项目   工具窗口中选择它，然后从上下文菜单中选择   运行 'npm install'  。

Procedure: 更新您的项目依赖项

* 请在弹出窗口中点击   运行 '<package manager> install'  。

![更新依赖项：弹出窗口](https://resources.jetbrains.com/help/img/idea/2026.3/ws_npm_yarn_package_run_npm_update.png)

IntelliJ IDEA 每次您打开项目、从版本控制中更新项目或编辑  `package.json` 时，都会显示此弹窗。

* IntelliJ IDEA 还会运行一项检查，用于检查来自  `dependencies`  或  `devDependencies`  的软件包是否已安装，以及其版本是否与指定范围匹配。 如果检查检测到任何不匹配，将建议快速修复。 要应用它，请点击   运行 '<package manager> install'  链接。

![已安装的软件包版本不是最新的](https://resources.jetbrains.com/help/img/idea/2026.3/ws_node_inspect_that_package_up_to_date.png)

* IntelliJ IDEA 还会检测可用的较新版本的软件包，并在您将鼠标悬停在软件包版本上时提供快速修复。

![更新软件包到最新版本：工具提示](https://resources.jetbrains.com/help/img/idea/2026.3/ws_node_package_json_update_to_latest_version_tooltip.png)

或者，按 `Alt+Enter` (Windows), `⌥ ⏎` (macOS), `⌥ ⏎` (IntelliJ IDEA Classic (macOS)), `⌥ ⏎` (macOS System Shortcuts), `Alt+Enter` (XWin), `Alt+Enter` (GNOME), `Alt+Enter` (KDE), `Alt+Enter` (Emacs), `Alt+Enter` (Sublime Text), `⌥ ⏎` (Sublime Text (macOS)), `Alt+Enter` (Visual Studio), `⌥ ⏎` (Visual Studio (macOS)), `Alt+Enter` (NetBeans), `Ctrl+1` (Eclipse), `⌘ 1` (Eclipse (macOS)) 并从列表中选择   将 <package> 更新到最新版本  ：

![将程序包更新到最新版本：quick-fix](https://resources.jetbrains.com/help/img/idea/2026.3/ws_node_package_json_update_to_latest_version_quick_fix.png)

> **Note:**
> 如果检测到 [自定义 npm 注册表](https://docs.npmjs.com/creating-and-publishing-private-packages)，则无法使用将软件包更新到最新版本的快速修复。

### 在内置终端中

Procedure:

在命令行 shell 或嵌入式   终端  （ `Alt+F12` (Windows), `⌥ F12` (macOS), `⌥ F12` (IntelliJ IDEA Classic (macOS)), `⌘ ⌃ T` (macOS System Shortcuts), `Alt+F12` (XWin), `Alt+F12` (GNOME), `Alt+F12` (KDE), `Alt+F12` (Emacs), `Alt+F12` (Sublime Text), `⌥ F12` (Sublime Text (macOS)), `Ctrl+Alt+1` (Visual Studio), `⌘ ⌃ 1` (Visual Studio (macOS)), `Alt+F12` (NetBeans), `Alt+F12` (Eclipse), `⌥ F12` (Eclipse (macOS))）中，输入以下命令之一：

* 全局安装：

* `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> --dev`

* `pnpm add --save-dev <package_name>`

Procedure: 安装 package.json 文件中列出的所有依赖项

在命令行 shell 或嵌入式   终端  （ `Alt+F12` (Windows), `⌥ F12` (macOS), `⌥ F12` (IntelliJ IDEA Classic (macOS)), `⌘ ⌃ T` (macOS System Shortcuts), `Alt+F12` (XWin), `Alt+F12` (GNOME), `Alt+F12` (KDE), `Alt+F12` (Emacs), `Alt+F12` (Sublime Text), `⌥ F12` (Sublime Text (macOS)), `Ctrl+Alt+1` (Visual Studio), `⌘ ⌃ 1` (Visual Studio (macOS)), `Alt+F12` (NetBeans), `Alt+F12` (Eclipse), `⌥ F12` (Eclipse (macOS))）中，输入以下命令之一：

* `npm install`

* `yarn install`

* `pnpm install`

因此，您将从当前文件夹中获取  `package.json`  中列出的所有依赖项。 了解更多信息，请参阅 [编辑 package.json](#ws_npm_yarn_edit_package_json)。

> **Note:**
> 对于通过 Yarn 2 安装的包，IntelliJ IDEA 显示  `yarn:package.json:<package name>`  而不是包的实际路径。 请注意，此格式仅用于在   设置   对话框中显示软件包，而不用于在代码或其他位置指定其位置。

### 检测漏洞包

IntelliJ IDEA 通过对比 [Mend.io 漏洞数据库](https://www.mend.io/vulnerability-database/?utm_source=JetBrains) 和 [国家漏洞数据库](https://nvd.nist.gov/)，检测您项目中使用的包的漏洞。 当您编写代码时，IDE 会高亮显示被认为脆弱的包，为它们提供描述，并在可用时建议修复措施。 整个检测到的漏洞包列表显示在   问题  工具窗口中。

漏洞检查由依赖于  Vulnerable declared dependency  [代码检查](code-inspection.html) 的 [Package Checker](https://plugins.jetbrains.com/plugin/18337-package-checker?_ga=2.120695503.698934348.1705064018-934746540.1705064018) 插件处理。 该插件由 [Mend.io](https://www.mend.io/jetbrains-lp/?utm_source=JetBrains) 提供支持。 该插件与 IntelliJ IDEA 捆绑并默认启用。 如果相关功能不可用，请确保未禁用该插件。 有关更多信息，请参阅 [打开插件设置](managing-plugins.html#open-plugin-settings)。

#### 在编辑器中解决包的漏洞问题

![检测易受攻击的包并在编辑器中修复](https://resources.jetbrains.com/help/img/idea/2026.3/ws_vulnerable_packages_editor.animated.gif)

Procedure:

1. 将鼠标悬停在  `package.json`  文件中高亮显示的包上。 弹出工具窗口显示检测到的漏洞描述。

2. 要应用快速修复，请点击   更多操作   `Alt+Enter` (Windows), `⌥ ⏎` (macOS), `⌥ ⏎` (IntelliJ IDEA Classic (macOS)), `⌥ ⏎` (macOS System Shortcuts), `Alt+Enter` (XWin), `Alt+Enter` (GNOME), `Alt+Enter` (KDE), `Alt+Enter` (Emacs), `Alt+Enter` (Sublime Text), `⌥ ⏎` (Sublime Text (macOS)), `Alt+Enter` (Visual Studio), `⌥ ⏎` (Visual Studio (macOS)), `Alt+Enter` (NetBeans), `Ctrl+1` (Eclipse), `⌘ 1` (Eclipse (macOS)) 并选择相关建议。

#### 分析代码以查找所有存在漏洞的软件包

![问题工具窗口：漏洞依赖项选项卡](https://resources.jetbrains.com/help/img/idea/2026.3/ws_problems_tw_vulnerable_dependencies_tab.png)

Procedure:

* 在主菜单中，选择  `代码 | 分析代码 | 漏洞依赖项` 。

* 在   问题   工具窗口的   存在漏洞的依赖项   选项卡中查看结果（  `视图 | 工具窗口 | 问题`  或 `Alt+6` (Windows), `⌘ 6` (macOS), `⌘ 6` (IntelliJ IDEA Classic (macOS)), `⌘ 6` (macOS System Shortcuts), `Alt+6` (XWin), `Alt+6` (GNOME), `Alt+6` (KDE), `Alt+6` (Emacs), `Alt+6` (Sublime Text), `⌘ 6` (Sublime Text (macOS)), `Alt+6` (Visual Studio), `⌘ 6` (Visual Studio (macOS)), `Alt+6` (NetBeans), `Alt+6` (Eclipse), `⌘ 6` (Eclipse (macOS))）。 每个项目都附有描述和严重性指示。

* 点击特定软件包，以获取有关其中发现的漏洞的更多信息。

* 要查看安全软件包版本列表，请点击 ![“显示安全依赖项”图标](https://resources.jetbrains.com/help/img/idea/2026.3/app-client.expui.general.show.svg)。

* 要解决问题，请在列表中选择漏洞包，点击右侧窗格中的   将安全版本复制到剪贴板   链接，然后将复制的版本粘贴到您的  `package.json` 。

从 [获取结果和解决问题](resolving-problems.html)中了解更多。

* 要忽略漏洞，请点击   忽略软件包中的漏洞   链接。

#### 禁用软件包漏洞检查

Procedure:

默认情况下，软件包漏洞检查已启用。

* 要将其关闭，请打开   设置  对话框（ `Ctrl+Alt+S` (Windows), `⌘ Comma` (macOS), `⌘ Comma` (IntelliJ IDEA Classic (macOS)), `⌘ Comma` (macOS System Shortcuts), `Ctrl+Alt+S` (XWin), `Ctrl+Alt+S` (GNOME), `Ctrl+Alt+S` (KDE), `Ctrl+Alt+S` (Emacs), `Ctrl+Alt+S` (Sublime Text), `⌘ Comma` (Sublime Text (macOS)), `Ctrl+Alt+S` (Visual Studio), `⌘ Comma` (Visual Studio (macOS)), `Ctrl+Alt+S` (NetBeans), `Ctrl+Alt+S` (Eclipse), `⌘ Comma` (Eclipse (macOS))），转到  `编辑器｜检查` ，并清除   安全性  节点下   已声明的存在漏洞的依赖项  检查旁边的复选框。

* 或者，打开   设置  对话框（ `Ctrl+Alt+S` (Windows), `⌘ Comma` (macOS), `⌘ Comma` (IntelliJ IDEA Classic (macOS)), `⌘ Comma` (macOS System Shortcuts), `Ctrl+Alt+S` (XWin), `Ctrl+Alt+S` (GNOME), `Ctrl+Alt+S` (KDE), `Ctrl+Alt+S` (Emacs), `Ctrl+Alt+S` (Sublime Text), `⌘ Comma` (Sublime Text (macOS)), `Ctrl+Alt+S` (Visual Studio), `⌘ Comma` (Visual Studio (macOS)), `Ctrl+Alt+S` (NetBeans), `Ctrl+Alt+S` (Eclipse), `⌘ Comma` (Eclipse (macOS))），转到  `插件` ，找到   软件包检查器  插件，然后点击   禁用  。

## 调试软件包

可以从  `node_modules`  文件夹调试软件包。

[Video](https://resources.jetbrains.com/help/img/idea/2026.3/ws_debug_packages.mp4)

Procedure:

1. 打开运行/调试配置以启动调试会话，并切换到   步进   选项卡。

2. 取消选中   不要步入源代码映射中指定的已知第三方脚本   和   不步入 URL 与以下模式匹配的脚本   复选框。

3. 根据需要设置 [断点](using-breakpoints.html)，然后 [启动调试](starting-the-debugger-session.html)会话。

4. 逐步执行编码，包括  `node_modules`  文件夹下的文件。

> **Tip:**
> 或者，也可以使用 [强制步入操作](stepping-through-the-program.html#force-step-into)。

## 运行脚本

您可以从编辑器中的  `package.json`  文件，从专用的   npm   工具窗口中的脚本树，根据专用运行配置，或者自动地以  start-up  或  before-launch  任务运行 npm、Yarn 或 pnpm 脚本。

脚本执行结果显示在 [运行工具窗口](run-tool-window.html) 中。 工具窗口显示 npm 或 Yarn 脚本输出，报告发生的错误，列出未找到的包或插件等。 上次执行的脚本名称会显示在工具窗口的标题栏上。

[Video](https://resources.jetbrains.com/help/img/idea/2026.3/ws_launch_npm_script_from_package_json_run.mp4)

如果您启动了脚本调试会话，IntelliJ IDEA 会打开 [调试工具窗口](debug-tool-window.html)，您可以在其中 [逐步执行脚本](stepping-through-the-program.html)、 [停止和恢复](starting-the-debugger-session.html#pause-resume)脚本执行、 [在脚本挂起时检查它](examining-suspended-program.html)、 [在调试器控制台中运行 JavaScript 代码片段](node-interactive-debugger-console.html)等。

### 从软件包.json运行脚本

IntelliJ IDEA 让您能够快速启动  `package.json`  文件中的单个脚本。 要运行或调试多个脚本，请使用运行配置或   npm   工具窗口。

Procedure:

* 在编辑器中打开相关  `package.json`  文件，点击脚本旁装订区域中的 ![运行按钮](https://resources.jetbrains.com/help/img/idea/2026.3/app-client.expui.run.run.svg)，然后从上下文菜单中选择   运行 <script_name>  。

![从 package.json 运行/调试脚本](https://resources.jetbrains.com/help/img/idea/2026.3/ws_launch_npm_script_from_package_json.png)

* 您也可以按 `Ctrl+Shift+F10` (Windows), `⌃ ⇧ R` (macOS), `⌃ ⇧ F10` (IntelliJ IDEA Classic (macOS)), `⌃ ⇧ R` (macOS System Shortcuts), `Ctrl+Shift+F10` (XWin), `Ctrl+Shift+F10` (GNOME), `Ctrl+Shift+F10` (KDE), `Ctrl+Shift+F10` (Emacs), `Ctrl+Shift+F10` (Sublime Text), `Ctrl+Shift+F10` (Sublime Text (macOS)), `Ctrl+Alt+F5` (Visual Studio), `⌃ ⌥ F5` (Visual Studio (macOS)), `Alt+Shift+F6` (NetBeans), `Ctrl+Shift+F10` (Eclipse), `⌃ ⇧ R` (Eclipse (macOS)) 运行脚本。

脚本输出显示在   运行  工具窗口中。

如果您以调试模式启动脚本，IntelliJ IDEA 会打开 [调试工具窗口](debug-tool-window.html)，您可以在其中 [逐步执行脚本](stepping-through-the-program.html)、 [停止和恢复](starting-the-debugger-session.html#pause-resume)脚本执行、 [在脚本挂起时检查它](examining-suspended-program.html)、 [在调试器控制台中运行 JavaScript 代码片段](node-interactive-debugger-console.html)等。

### 从 npm 工具窗口运行脚本

在   项目   工具窗口 ( `Alt+1` (Windows), `⌘ 1` (macOS), `⌘ 1` (IntelliJ IDEA Classic (macOS)), `⌘ 1` (macOS System Shortcuts), `Alt+1` (XWin), `Alt+1` (GNOME), `Alt+1` (KDE), `Alt+1` (Emacs), `Alt+1` (Sublime Text), `⌘ 1` (Sublime Text (macOS)), `Ctrl+Alt+L` (Visual Studio), `⌘ ⌥ L` (Visual Studio (macOS)), `Ctrl+1` (NetBeans), `Alt+1` (Eclipse), `Alt+1` (Eclipse (macOS))) 中选择  `package.json`  文件，或在编辑器中打开该文件并从上下文菜单中选择   显示 npm脚本   时，   npm   工具窗口会打开。

调用 npm、pnpm 或 Yarn 后，该工具会开始构建脚本树，其中包含在被调用的  `package.json`  文件的  `scripts`  属性中定义的脚本。

如果项目中有多个  `package.json`  文件，可以为每个文件构建单独的脚本树，并在不丢弃之前构建的树的情况下运行脚本。 每棵树都会显示在单独的节点下。

Procedure: 如果 npm 工具窗口尚未打开，请将其打开

* 在   项目   工具窗口 ( `Alt+1` (Windows), `⌘ 1` (macOS), `⌘ 1` (IntelliJ IDEA Classic (macOS)), `⌘ 1` (macOS System Shortcuts), `Alt+1` (XWin), `Alt+1` (GNOME), `Alt+1` (KDE), `Alt+1` (Emacs), `Alt+1` (Sublime Text), `⌘ 1` (Sublime Text (macOS)), `Ctrl+Alt+L` (Visual Studio), `⌘ ⌥ L` (Visual Studio (macOS)), `Ctrl+1` (NetBeans), `Alt+1` (Eclipse), `Alt+1` (Eclipse (macOS))) 中选择所需的  ``  文件，或在编辑器中打开它，然后从上下文菜单中选择   显示 npm脚本  。

![打开 npm 工具窗口](https://resources.jetbrains.com/help/img/idea/2026.3/ws_open_npm_tw.png)

npm  工具窗口将打开，其中显示根据选定或打开的  `package.json` 文件构建的脚本树。

Procedure: 在已打开的 npm 工具窗口中构建脚本树

1. 在   npm   工具窗口中，点击工具栏上的 !["添加"按钮](https://resources.jetbrains.com/help/img/idea/2026.3/app.expui.general.add.svg)，然后从列表中选择所需的  `package.json`  文件。 默认情况下，IntelliJ IDEA 会显示项目根目录中的  `package.json`  文件。

2. 如果您有其他  `package.json`  文件，请点击   选择 package.json  ，并在打开的对话框中选择所需的  `package.json`  文件。 IntelliJ IDEA 添加一个新节点，该节点的标题包含所选  `package.json`  文件的路径，并在新节点下构建脚本树。

![构建另一个脚本树](https://resources.jetbrains.com/help/img/idea/2026.3/ws_npm_tw_build_tree.png)

Procedure: 重新构建树

* 切换到所需节点，然后点击工具栏上的 ![重新加载脚本](https://resources.jetbrains.com/help/img/idea/2026.3/app.actions.refresh.svg)。

[Video](https://resources.jetbrains.com/help/img/idea/2026.3/ws_npm_tw_reload_scripts.mp4)

Procedure: 按名称对树中的脚本进行排序

* 点击工具栏上的 ![设置](https://resources.jetbrains.com/help/img/idea/2026.3/app.general.gear.svg)，从菜单中选择   排序方式  ，然后选择   名称  。

默认情况下，树会按脚本在  `package.json`  中定义的顺序显示脚本（选项   定义顺序  ）。

[Video](https://resources.jetbrains.com/help/img/idea/2026.3/ws_npm_tw_sort_scripts.mp4)

Procedure: 运行一个脚本

* 点击脚本两次。

* 在树中选择脚本，然后按 `Enter` (Windows), `⏎` (macOS), `⏎` (IntelliJ IDEA Classic (macOS)), `⏎` (macOS System Shortcuts), `Enter` (XWin), `Enter` (GNOME), `Enter` (KDE), `Enter` (Emacs), `Enter` (Sublime Text), `⏎` (Sublime Text (macOS)), `Enter` (Visual Studio), `⏎` (Visual Studio (macOS)), `Enter` (NetBeans), `Enter` (Eclipse), `⏎` (Eclipse (macOS))，或从上下文菜单中选择   运行 <脚本名称>  。

[Video](https://resources.jetbrains.com/help/img/idea/2026.3/ws_run_npm_script_from_npm_tw.mp4)

Procedure: 运行多个脚本

* 使用多选模式：按住 `Shift` (Windows), `Shift` (macOS), `Shift` (IntelliJ IDEA Classic (macOS)), `Shift` (macOS System Shortcuts), `Shift` (XWin), `Shift` (GNOME), `Shift` (KDE), `Shift` (Emacs), `Shift` (Sublime Text), `Shift` (Sublime Text (macOS)), `Shift` (Visual Studio), `Shift` (Visual Studio (macOS)), `Shift` (NetBeans), `Shift` (Eclipse), `Shift` (Eclipse (macOS))（用于相邻项）或 `Ctrl` (Windows), `Ctrl` (macOS), `Ctrl` (IntelliJ IDEA Classic (macOS)), `Ctrl` (macOS System Shortcuts), `Ctrl` (XWin), `Ctrl` (GNOME), `Ctrl` (KDE), `Ctrl` (Emacs), `Ctrl` (Sublime Text), `Ctrl` (Sublime Text (macOS)), `Ctrl` (Visual Studio), `Ctrl` (Visual Studio (macOS)), `Ctrl` (NetBeans), `Ctrl` (Eclipse), `Ctrl` (Eclipse (macOS))（用于不相邻项）并选择所需脚本，然后从所选内容的上下文菜单中选择   运行   或   调试  。

![运行多个脚本](https://resources.jetbrains.com/help/img/idea/2026.3/ws_npm_tw_run_multiple_scripts.png)

### 通过运行配置运行脚本

当您从编辑器或   npm   工具窗口运行或调试脚本时，IntelliJ IDEA 会自动创建  临时 运行配置。 除了使用它们，您还可以创建并启动您自己的 npm run 配置。

Procedure: 创建一个 NPM 运行/调试配置

1. 前往  `运行 | 编辑配置` 。 或者，在工具栏上的   运行   小部件中选择   编辑配置  。

![打开编辑配置对话框](https://resources.jetbrains.com/help/img/idea/2026.3/ws_node_run_config_create.png)

2. 在打开的   编辑配置  对话框中，点击工具栏上的   添加  按钮（ !["添加"按钮](https://resources.jetbrains.com/help/img/idea/2026.3/app.expui.general.add.svg)），然后从列表中选择   npm  。 [运行/调试配置：npm 对话框](run-debug-configuration-npm.html) 打开。

3. 指定要执行的 CLI 命令、要运行的脚本（使用空格作为分隔符），以及定义这些脚本的  `package.json` 文件的位置。 可选地，键入执行脚本的 [command-line arguments](https://docs.npmjs.com/cli/run-script#description)。

4. 指定要使用的 Node.js 运行时。

如果您选择   项目   别名， IntelliJ IDEA 将自动使用在 [JavaScript 运行时](javascript-runtime.html) 页面上   Node.js 运行时   字段中的项目默认解释器。 在大多数情况下， IntelliJ IDEA 会检测到项目的默认运行时，并自动填写该字段。

您还可以选择其他已配置的本地或远程解释器，或点击 ![浏览按钮](https://resources.jetbrains.com/help/img/idea/2026.3/app.general.ellipsis.svg) 并配置一个新的解释器。

可选择指定要传递给 Node.js 的 [Node.js 特定选项形参](run-debug-configuration-node-js.html#node_parameters)和 [环境变量](https://www.w3schools.com/nodejs/nodejs_environment.asp)。

变量定义显示在   环境变量   字段中，并用分号 (  `;` ) 分隔，例如：

* `NODE_PATH` 用于解析模块时搜索的附加目录列表。 在 macOS 或 Linux 上，目录列表请用冒号 ( `:` ) 分隔；在 Windows 上请用分号 ( `;` ) 分隔。

* `NODE_MODULE_CONTEXTS` 设置为 1 以在各自的全局上下文中加载模块。

* `NODE_DISABLE_COLORS` 设置为 1 以在 REPL 中禁用颜色。

![环境变量](https://resources.jetbrains.com/help/img/idea/2026.3/nodeEnvironmentVariables.png)

或者，点击字段右侧的   浏览   ![编辑环境变量](https://resources.jetbrains.com/help/img/idea/2026.3/app-client.expui.inline.variables.svg)，并在打开的   环境变量   对话框中配置变量列表：

* 请使用 ![](https://resources.jetbrains.com/help/img/idea/2026.3/app.expui.general.add.svg)、 ![](https://resources.jetbrains.com/help/img/idea/2026.3/app.expui.general.remove.svg)、 ![](https://resources.jetbrains.com/help/img/idea/2026.3/app.expui.general.copy.svg) 和 ![](https://resources.jetbrains.com/help/img/idea/2026.3/app.expui.general.paste.svg) 按钮来管理自定义变量列表。

* 该对话框还会显示可用的系统环境变量列表。 如果不想为当前配置使用系统环境变量，请清除 包括系统环境变量 复选框。

* 准备就绪后，点击 OK 。

5. 指定要使用的包管理器。 如果选择  `项目`  别名，IntelliJ IDEA 将使用来自 [JavaScript 运行时](javascript-runtime.html) 页面的默认项目包管理器。 您还可以选择相关的软件包别名（  npm  或  yarn ）或指定自定义安装的软件包管理器的显式路径。

6. 如果您在 Docker 容器中使用远程 Node.js 运行时，请检查自动生成的 Docker 容器设置。 点击 ![展开图标](https://resources.jetbrains.com/help/img/idea/2026.3/app-client.expui.inline.expand.svg)，在弹出窗口中打开设置。

![检查 Docker 容器设置](https://resources.jetbrains.com/help/img/idea/2026.3/ws_npm_docker_run_configuration_docker_container_settings.png)

请参阅 [将 npm、pnpm 和 yarn 与 Docker 配合使用](#ws_node_docker_manage_dependencies) 和 [配置远程 Node.js 运行时](configuring-remote-node-interpreters.html) 了解详情。

Procedure: 运行脚本

* 从工具栏上的   运行   微件中选择新创建的运行配置，然后点击其旁边的 ![运行](https://resources.jetbrains.com/help/img/idea/2026.3/app.expui.run.run.svg) 或 ![调试](https://resources.jetbrains.com/help/img/idea/2026.3/app.expui.run.debug.svg)。

* 脚本执行结果显示在 [运行工具窗口](run-tool-window.html) 中。

* 如果您点击 ![调试](https://resources.jetbrains.com/help/img/idea/2026.3/app.expui.run.debug.svg)，IntelliJ IDEA 会打开 [调试工具窗口](debug-tool-window.html)，您可以在其中 [逐步执行脚本](stepping-through-the-program.html)、 [停止和恢复](starting-the-debugger-session.html#pause-resume)脚本执行、 [在脚本挂起时检查它](examining-suspended-program.html)、 [在调试器控制台中运行 JavaScript 代码片段](node-interactive-debugger-console.html)等。

### 使用 Run Anything 运行脚本

Run Anything  是启动脚本的快捷方式。

Procedure:

1. 按 `Ctrl` (Windows), `Ctrl` (macOS), `Ctrl` (IntelliJ IDEA Classic (macOS)), `Ctrl` (macOS System Shortcuts), `Ctrl` (XWin), `Ctrl` (GNOME), `Ctrl` (KDE), `Ctrl` (Emacs), `Ctrl` (Sublime Text), `Ctrl` (Sublime Text (macOS)), `Ctrl` (Visual Studio), `Ctrl` (Visual Studio (macOS)), `Ctrl` (NetBeans), `Ctrl` (Eclipse), `Ctrl` (Eclipse (macOS)) 两次或点击导航栏上的 ![“运行任何内容”按钮](https://resources.jetbrains.com/help/img/idea/2026.3/app.actions.run_anything.svg)。   运行任何内容  弹出窗口打开了。

2. 在搜索字段中输入软件包管理器的名称。 输入时，IntelliJ IDEA 会显示匹配的命令。

![运行任何内容：输入软件包管理器的名称](https://resources.jetbrains.com/help/img/idea/2026.3/ws_run_anything_npm.png)

或者，输入脚本的名称。

![运行任何内容：输入脚本名称](https://resources.jetbrains.com/help/img/idea/2026.3/ws_run_anything_type_script_name.png)

最后，您可以输入  `?`  以获取命令提示列表。

![“运行任何内容”中的可用命令列表](https://resources.jetbrains.com/help/img/idea/2026.3/ws_run_anything_commands_hints.png)

导航到相应的提示并按下 `Space` (Windows), `Space` (macOS), `Space` (IntelliJ IDEA Classic (macOS)), `Space` (macOS System Shortcuts), `Space` (XWin), `Space` (GNOME), `Space` (KDE), `Space` (Emacs), `Space` (Sublime Text), `Space` (Sublime Text (macOS)), `Space` (Visual Studio), `Space` (Visual Studio (macOS)), `Space` (NetBeans), `Space` (Eclipse), `Space` (Eclipse (macOS)) 以获取可用命令列表，从列表中选择所需命令，然后按下 `Enter` (Windows), `⏎` (macOS), `⏎` (IntelliJ IDEA Classic (macOS)), `⏎` (macOS System Shortcuts), `Enter` (XWin), `Enter` (GNOME), `Enter` (KDE), `Enter` (Emacs), `Enter` (Sublime Text), `⏎` (Sublime Text (macOS)), `Enter` (Visual Studio), `⏎` (Visual Studio (macOS)), `Enter` (NetBeans), `Enter` (Eclipse), `⏎` (Eclipse (macOS))。

若要在   运行   工具窗口中查看命令输出，请按 `Ctrl+Enter` (Windows), `Ctrl+Enter` (macOS), `Ctrl+Enter` (IntelliJ IDEA Classic (macOS)), `Ctrl+Enter` (macOS System Shortcuts), `Ctrl+Enter` (XWin), `Ctrl+Enter` (GNOME), `Ctrl+Enter` (KDE), `Ctrl+Enter` (Emacs), `Ctrl+Enter` (Sublime Text), `Ctrl+Enter` (Sublime Text (macOS)), `Ctrl+Enter` (Visual Studio), `Ctrl+Enter` (Visual Studio (macOS)), `Ctrl+Enter` (NetBeans), `Ctrl+Enter` (Eclipse), `Ctrl+Enter` (Eclipse (macOS))，若要在   调试   工具窗口中显示输出，请按 `Shift+Enter` (Windows), `Shift+Enter` (macOS), `Shift+Enter` (IntelliJ IDEA Classic (macOS)), `Shift+Enter` (macOS System Shortcuts), `Shift+Enter` (XWin), `Shift+Enter` (GNOME), `Shift+Enter` (KDE), `Shift+Enter` (Emacs), `Shift+Enter` (Sublime Text), `Shift+Enter` (Sublime Text (macOS)), `Shift+Enter` (Visual Studio), `Shift+Enter` (Visual Studio (macOS)), `Shift+Enter` (NetBeans), `Shift+Enter` (Eclipse), `Shift+Enter` (Eclipse (macOS))。

![通过 Run Anything 弹出窗口在运行或调试工具窗口中运行 npm 命令](https://resources.jetbrains.com/help/img/idea/2026.3/ws_smart_command_execution_npm_serve_run_anything_debug.animated.gif)

### 在启动时自动运行脚本

如果您有一些脚本需要定期运行，您可以将相应的 run configurations 添加到  startup tasks  列表中。 任务将在项目启动时自动执行。

Procedure:

1. 在   设置   对话框（ `Ctrl+Alt+S` (Windows), `⌘ Comma` (macOS), `⌘ Comma` (IntelliJ IDEA Classic (macOS)), `⌘ Comma` (macOS System Shortcuts), `Ctrl+Alt+S` (XWin), `Ctrl+Alt+S` (GNOME), `Ctrl+Alt+S` (KDE), `Ctrl+Alt+S` (Emacs), `Ctrl+Alt+S` (Sublime Text), `⌘ Comma` (Sublime Text (macOS)), `Ctrl+Alt+S` (Visual Studio), `⌘ Comma` (Visual Studio (macOS)), `Ctrl+Alt+S` (NetBeans), `Ctrl+Alt+S` (Eclipse), `⌘ Comma` (Eclipse (macOS))），转到  `工具 | 启动任务` 。

2. 在打开的 [启动任务页面](settings-tools-startup-tasks.html)上，点击工具栏上的 !["添加"按钮](https://resources.jetbrains.com/help/img/idea/2026.3/app.expui.general.add.svg)。

3. 从列表中选择所需的  npm  运行配置。 配置已添加到列表中。

如果项目中没有可用的适用配置，请点击 ![添加按钮`](https://resources.jetbrains.com/help/img/idea/2026.3/app.expui.general.add.svg)并选择   编辑配置  。 然后在打开的 [Run/Debug configuration](run-debug-configuration-npm.html)页面上定义具有所需设置的配置。 当您保存新配置时，它会自动添加到启动任务列表中。

### 将脚本作为启动前的任务运行

Procedure:

1. 通过从主菜单中选择  `运行 | 编辑配置` 打开 [运行/调试配置对话框](run-debug-configurations-dialog.html)对话框，并从列表中选择所需的配置，或者点击 ![添加新配置](https://resources.jetbrains.com/help/img/idea/2026.3/app.expui.general.add.svg)并选择相关的运行配置类型以重新创建它。

2. 在打开的对话框中，点击 ![添加](https://resources.jetbrains.com/help/img/idea/2026.3/app.expui.general.add.svg)区域中的   启动前  ，并从列表中选择   运行 npm 脚本  。

3. 在打开的   npm 脚本  对话框中，指定 [npm 运行/调试配置设置](null)。

## 调试脚本

可以从编辑器中的  `package.json`  文件、专用   npm   工具窗口中的脚本树，或根据专用运行配置开始调试 npm、Yarn 或 pnpm 脚本。

无论哪种情况，IntelliJ IDEA 都会打开 [调试工具窗口](debug-tool-window.html)，可在其中 [逐步执行脚本](stepping-through-the-program.html)、 [停止和恢复](starting-the-debugger-session.html#pause-resume)脚本执行、 [在脚本挂起时检查它](examining-suspended-program.html)、 [在调试器控制台中运行 JavaScript 代码段](node-interactive-debugger-console.html)等。

### 从软件包.json调试脚本

IntelliJ IDEA 可让你从  `package.json`  文件快速启动单个脚本的调试会话。 要调试多个脚本，请使用运行配置或   npm   工具窗口。

Procedure:

* 在编辑器中打开相关  `package.json`  文件，点击脚本旁装订区域中的 ![运行按钮](https://resources.jetbrains.com/help/img/idea/2026.3/app-client.expui.run.run.svg)，然后从上下文菜单中选择   调试 <script_name>  。

![从软件包.json调试脚本](https://resources.jetbrains.com/help/img/idea/2026.3/ws_debug_npm_script_from_package_json.png)

IntelliJ IDEA 会打开 [调试工具窗口](debug-tool-window.html)，可在其中 [逐步执行脚本](stepping-through-the-program.html)、 [停止和恢复](starting-the-debugger-session.html#pause-resume)脚本执行、 [在脚本挂起时检查它](examining-suspended-program.html)、 [在调试器控制台中运行 JavaScript 代码段](node-interactive-debugger-console.html)等。

### 从 npm 工具窗口调试脚本

在   项目   工具窗口 ( `Alt+1` (Windows), `⌘ 1` (macOS), `⌘ 1` (IntelliJ IDEA Classic (macOS)), `⌘ 1` (macOS System Shortcuts), `Alt+1` (XWin), `Alt+1` (GNOME), `Alt+1` (KDE), `Alt+1` (Emacs), `Alt+1` (Sublime Text), `⌘ 1` (Sublime Text (macOS)), `Ctrl+Alt+L` (Visual Studio), `⌘ ⌥ L` (Visual Studio (macOS)), `Ctrl+1` (NetBeans), `Alt+1` (Eclipse), `Alt+1` (Eclipse (macOS))) 中选择  `package.json`  文件，或在编辑器中打开该文件并从上下文菜单中选择   显示 npm脚本   时，   npm   工具窗口会打开。

调用 npm、pnpm 或 Yarn 后，该工具会开始构建脚本树，其中包含在被调用的  `package.json`  文件的  `scripts`  属性中定义的脚本。

如果项目中有多个  `package.json`  文件，可以为每个文件构建单独的脚本树，并在不丢弃之前构建的树的情况下运行脚本。 每棵树都会显示在单独的节点下。

#### 如果 npm 工具窗口尚未打开，请将其打开

Procedure:

* 在   项目   工具窗口 ( `Alt+1` (Windows), `⌘ 1` (macOS), `⌘ 1` (IntelliJ IDEA Classic (macOS)), `⌘ 1` (macOS System Shortcuts), `Alt+1` (XWin), `Alt+1` (GNOME), `Alt+1` (KDE), `Alt+1` (Emacs), `Alt+1` (Sublime Text), `⌘ 1` (Sublime Text (macOS)), `Ctrl+Alt+L` (Visual Studio), `⌘ ⌥ L` (Visual Studio (macOS)), `Ctrl+1` (NetBeans), `Alt+1` (Eclipse), `Alt+1` (Eclipse (macOS))) 中选择所需的  ``  文件，或在编辑器中打开它，然后从上下文菜单中选择   显示 npm脚本  。

![打开 npm 工具窗口](https://resources.jetbrains.com/help/img/idea/2026.3/ws_open_npm_tw.png)

npm  工具窗口将打开，其中显示根据选定或打开的  `package.json` 文件构建的脚本树。

#### 在已打开的 npm 工具窗口中构建脚本树

Procedure:

1. 在   npm   工具窗口中，点击工具栏上的 !["添加"按钮](https://resources.jetbrains.com/help/img/idea/2026.3/app.expui.general.add.svg)，然后从列表中选择所需的  `package.json`  文件。 默认情况下，IntelliJ IDEA 会显示项目根目录中的  `package.json`  文件。

2. 如果您有其他  `package.json`  文件，请点击   选择 package.json  ，并在打开的对话框中选择所需的  `package.json`  文件。 IntelliJ IDEA 添加一个新节点，该节点的标题包含所选  `package.json`  文件的路径，并在新节点下构建脚本树。

![构建另一个脚本树](https://resources.jetbrains.com/help/img/idea/2026.3/ws_npm_tw_build_tree.png)

#### 重新构建树

Procedure:

* 切换到所需节点，然后点击工具栏上的 ![重新加载脚本](https://resources.jetbrains.com/help/img/idea/2026.3/app.actions.refresh.svg)。

[Video](https://resources.jetbrains.com/help/img/idea/2026.3/ws_npm_tw_reload_scripts.mp4)

#### 按名称对树中的脚本进行排序

Procedure:

* 点击工具栏上的 ![设置](https://resources.jetbrains.com/help/img/idea/2026.3/app.general.gear.svg)，从菜单中选择   排序方式  ，然后选择   名称  。

默认情况下，树会按脚本在  `package.json`  中定义的顺序显示脚本（选项   定义顺序  ）。

[Video](https://resources.jetbrains.com/help/img/idea/2026.3/ws_npm_tw_sort_scripts.mp4)

#### 调试一个脚本

Procedure:

* 在树中选择脚本，并从上下文菜单中选择   调试 <script_name>  。

IntelliJ IDEA 会打开 [调试工具窗口](debug-tool-window.html)，您可以在其中 [逐步执行脚本](stepping-through-the-program.html)、 [停止和恢复](starting-the-debugger-session.html#pause-resume)脚本执行、 [在脚本挂起时检查它](examining-suspended-program.html)、 [在调试器控制台中运行 JavaScript 代码片段](node-interactive-debugger-console.html)等。

[Video](https://resources.jetbrains.com/help/img/idea/2026.3/ws_debug_npm_script_from_npm_tw.mp4)

#### 调试多个脚本

Procedure:

* 使用多选模式：按住 `Shift` (Windows), `Shift` (macOS), `Shift` (IntelliJ IDEA Classic (macOS)), `Shift` (macOS System Shortcuts), `Shift` (XWin), `Shift` (GNOME), `Shift` (KDE), `Shift` (Emacs), `Shift` (Sublime Text), `Shift` (Sublime Text (macOS)), `Shift` (Visual Studio), `Shift` (Visual Studio (macOS)), `Shift` (NetBeans), `Shift` (Eclipse), `Shift` (Eclipse (macOS))（用于相邻项）或 `Ctrl` (Windows), `Ctrl` (macOS), `Ctrl` (IntelliJ IDEA Classic (macOS)), `Ctrl` (macOS System Shortcuts), `Ctrl` (XWin), `Ctrl` (GNOME), `Ctrl` (KDE), `Ctrl` (Emacs), `Ctrl` (Sublime Text), `Ctrl` (Sublime Text (macOS)), `Ctrl` (Visual Studio), `Ctrl` (Visual Studio (macOS)), `Ctrl` (NetBeans), `Ctrl` (Eclipse), `Ctrl` (Eclipse (macOS))（用于不相邻项）并选择所需脚本，然后从所选内容的上下文菜单中选择   运行   或   调试  。

![调试多个脚本](https://resources.jetbrains.com/help/img/idea/2026.3/ws_npm_tw_debug_multiple_scripts.png)

### 通过运行配置调试脚本

当您从编辑器或   npm   工具窗口运行或调试脚本时，IntelliJ IDEA 会自动创建  临时 运行配置。 除了使用它们，您还可以创建并启动您自己的 npm run 配置。

Procedure:

1. 前往  `运行 | 编辑配置` 。 或者，在工具栏上的   运行   小部件中选择   编辑配置  。

![打开编辑配置对话框](https://resources.jetbrains.com/help/img/idea/2026.3/ws_node_run_config_create.png)

2. 在打开的   编辑配置  对话框中，点击工具栏上的   添加  按钮（ !["添加"按钮](https://resources.jetbrains.com/help/img/idea/2026.3/app.expui.general.add.svg)），然后从列表中选择   npm  。 [运行/调试配置：npm 对话框](run-debug-configuration-npm.html) 打开。

3. 指定要执行的 CLI 命令、要运行的脚本（使用空格作为分隔符），以及定义这些脚本的  `package.json` 文件的位置。 可选地，键入执行脚本的 [command-line arguments](https://docs.npmjs.com/cli/run-script#description)。

4. 指定要使用的 Node.js 运行时。

如果您选择   项目   别名， IntelliJ IDEA 将自动使用在 [JavaScript 运行时](javascript-runtime.html) 页面上   Node.js 运行时   字段中的项目默认解释器。 在大多数情况下， IntelliJ IDEA 会检测到项目的默认运行时，并自动填写该字段。

您还可以选择其他已配置的本地或远程解释器，或点击 ![浏览按钮](https://resources.jetbrains.com/help/img/idea/2026.3/app.general.ellipsis.svg) 并配置一个新的解释器。

可选择指定要传递给 Node.js 的 [Node.js 特定选项形参](run-debug-configuration-node-js.html#node_parameters)和 [环境变量](https://www.w3schools.com/nodejs/nodejs_environment.asp)。

变量定义显示在   环境变量   字段中，并用分号 (  `;` ) 分隔，例如：

* `NODE_PATH` 用于解析模块时搜索的附加目录列表。 在 macOS 或 Linux 上，目录列表请用冒号 ( `:` ) 分隔；在 Windows 上请用分号 ( `;` ) 分隔。

* `NODE_MODULE_CONTEXTS` 设置为 1 以在各自的全局上下文中加载模块。

* `NODE_DISABLE_COLORS` 设置为 1 以在 REPL 中禁用颜色。

![环境变量](https://resources.jetbrains.com/help/img/idea/2026.3/nodeEnvironmentVariables.png)

或者，点击字段右侧的   浏览   ![编辑环境变量](https://resources.jetbrains.com/help/img/idea/2026.3/app-client.expui.inline.variables.svg)，并在打开的   环境变量   对话框中配置变量列表：

* 请使用 ![](https://resources.jetbrains.com/help/img/idea/2026.3/app.expui.general.add.svg)、 ![](https://resources.jetbrains.com/help/img/idea/2026.3/app.expui.general.remove.svg)、 ![](https://resources.jetbrains.com/help/img/idea/2026.3/app.expui.general.copy.svg) 和 ![](https://resources.jetbrains.com/help/img/idea/2026.3/app.expui.general.paste.svg) 按钮来管理自定义变量列表。

* 该对话框还会显示可用的系统环境变量列表。 如果不想为当前配置使用系统环境变量，请清除 包括系统环境变量 复选框。

* 准备就绪后，点击 OK 。

5. 指定要使用的包管理器。 如果选择  `项目`  别名，IntelliJ IDEA 将使用来自 [JavaScript 运行时](javascript-runtime.html) 页面的默认项目包管理器。 您还可以选择相关的软件包别名（  npm  或  yarn ）或指定自定义安装的软件包管理器的显式路径。

6. 如果您在 Docker 容器中使用远程 Node.js 运行时，请检查自动生成的 Docker 容器设置。 点击 ![展开图标](https://resources.jetbrains.com/help/img/idea/2026.3/app-client.expui.inline.expand.svg)，在弹出窗口中打开设置。

![检查 Docker 容器设置](https://resources.jetbrains.com/help/img/idea/2026.3/ws_npm_docker_run_configuration_docker_container_settings.png)

请参阅 [将 npm、pnpm 和 yarn 与 Docker 配合使用](#ws_node_docker_manage_dependencies) 和 [配置远程 Node.js 运行时](configuring-remote-node-interpreters.html) 了解详情。

7. 从工具栏上的   运行   微件中选择新创建的运行配置，然后点击其旁边的 ![调试](https://resources.jetbrains.com/help/img/idea/2026.3/app.expui.run.debug.svg)。

IntelliJ IDEA 会打开 [调试工具窗口](debug-tool-window.html)，可在其中 [逐步执行脚本](stepping-through-the-program.html)、 [停止和恢复](starting-the-debugger-session.html#pause-resume)脚本执行、 [在脚本挂起时检查它](examining-suspended-program.html)、 [在调试器控制台中运行 JavaScript 代码段](node-interactive-debugger-console.html)等。

## 在 Docker 中使用 npm、pnpm 和 yarn

有了 IntelliJ IDEA，您可以编辑  `package.json` ，安装、更新和移除 Docker 容器中项目的依赖项，就像在本地操作一样。

Procedure:

1. 按照 [从 JetBrains Marketplace 安装插件](managing-plugins.html#install_plugin_from_repo)中所述，在   设置 | 插件  页面上安装并启用  Node.js 远程解释器 插件。

2. 请确保  Node.js  和  Docker  所需插件已在   设置 | 插件   页面上启用。 有关更多信息，请参阅 [管理插件](managing-plugins.html)。

3. 下载、安装并配置  Docker ，如 [Docker](docker.html)中所述

4. [在 Docker 中配置 Node.js 远程解释器](node-with-docker.html#ws_node_docker_configure_interpreter)，或通过 [Docker Compose](node-with-docker-compose.html#ws_node_docker_compose_configure_interpreter)，并在您的项目中 [将其设置为默认](node-with-docker.html#ws_node_docker_manage_dependencies)。 此外，请确保与此远程解释器关联的包管理器已 [设置为项目默认](node-with-docker.html#ws_node_docker_manage_dependencies)。

5. 与本地开发一样进行操作： [编辑您的 package.json](#ws_npm_yarn_edit_package_json)， [管理项目依赖项](#ws_installing_and_upgrading_packages)，并 [运行或调试脚本](#ws_npm_running_npm_scripts)。

## See also

### 过程

[Bower](using-bower-package-manager.html) [File Watchers](using-file-watchers.html)

### 参考

[JavaScript 运行时环境](javascript-runtime.html)