配置 JavaScript 库

在语言与 IDE 的上下文中， library 是一个文件或一组文件。这些文件中的函数与方法除了来自您编辑的项目代码中由 WebStorm 检索的函数与方法外，还会被添加到 WebStorm 的内部知识中。在项目作用域中，其库默认是写保护的。

WebStorm 保留两个预定义的自动生成库文件夹：

node_modules 用于保存项目 package.json 中 dependencies 对象中列出的 Node.js 包。如需了解详情，请参阅配置 node_modules 库。
External Libraries 用于存储已下载的 TypeScript 定义文件、通过 CDN 链接引用的库、 Node.js Core 模块或任何自定义第三方库。

下载 TypeScript 社区存根（TypeScript 定义文件）

在 WebStorm 中， DefinitelyTyped 存根可作为库进行配置和使用，在以下情形中特别有用：

用于改进代码补全、解析对 WebStorm 静态分析而言过于复杂的库或框架中的符号，并为这些符号补充类型信息。
用于解析测试框架中全局定义的符号。

以下示例展示了 Express 应用中的一段代码，其中 post() 函数未被解析：

安装 TypeScript 定义文件后，WebStorm 成功解析 post()：

通过 WebStorm，您可以直接在编辑器中使用意图操作下载 TypeScript 定义文件，或在设置：JavaScript 库页面中执行此操作。

使用意图操作下载 TypeScript 定义

将插入符号置于包含该库或框架的 import 或 require 语句上，按 Alt+Enter ，然后选择安装TypeScript 定义以提供更好的类型信息：
WebStorm 将下载该库的类型定义，并将其添加到 JavaScript. 库库页面上的库列表中：
或者，打开 package.json ，将插入符号置于要下载类型定义的包上，按 Alt+Enter ，并选择安装 '@types/<package name>'。

在 JavaScript 库页面下载 TypeScript 定义

按下 Ctrl+Alt+S 以打开设置，然后选择语言与框架｜JavaScript｜库。
在打开的库页面上，单击下载，在打开的下载库对话框中，选择所需的库并点击下载并安装。

WebStorm 在项目工具窗口 Alt+1 中的外部库节点下显示已下载的类型定义。

可选

WebStorm 在当前项目的作用域中启用已下载的类型定义。您可以按照下方配置库作用域中的说明更改此作用域。另请参阅示例：配置 HTML 和 Node.js Core 库的作用域。

配置 Node.js 核心库

要获取对 fs、 path、 http 及其他编译到 Node.js 可执行文件中的核心模块的代码补全与引用解析，必须将 Node.js Core 模块源配置为 JavaScript 库。

按下 Ctrl+Alt+S 以打开设置，然后选择语言与框架｜Node.js。
选中 Node.js 编码协助 (A) 复选框。
请注意，Node.js Core 库特定于版本。因此，如果您在 Node.js 页面更改了 Node.js 的版本，则需要重新选中该复选框。之后，WebStorm 会为该新版本创建一个新库。

配置 node_modules 库

为了为项目依赖项提供代码补全，WebStorm 自动创建一个 node_modules 库，因此 Node.js 模块保留在项目中但不会对其执行任何检查，从而提高性能。

在项目工具窗口 Alt+1 中， node_modules 也被标记为库：

但 node_modules 库仅包含项目 dependencies 文件中 package.json 对象所列的模块。 WebStorm 不会将依赖项的依赖项包含到 node_modules 库中，而是将其从项目中排除。

配置库的作用域

有时，您可能会注意到 WebStorm 提供了无关的代码补全，例如在客户端代码中建议 Node.js API。这是因为默认情况下，WebStorm 在整个项目文件夹中使用某个库来进行补全。 WebStorm 允许通过配置库的作用域来优化代码补全。

按下 Ctrl+Alt+S 以打开设置，然后选择语言与框架｜JavaScript｜库。
库页面显示可用库列表。
清除所需库旁边的已启用复选框，然后点击管理作用域。将打开 JavaScript Libraries。将打开 Usage Scope 对话框。
在 JavaScript 库用法作用域对话框中，点击添加按钮（），并选择要包含在库作用域中的文件或文件夹。在 JavaScript 库用法作用域对话框中，路径字段显示所选文件或文件夹。
对于每个添加的文件或文件夹，从库列表中选择正在配置的库。

示例：配置 HTML 和 Node.js 核心库的作用域

在 WebStorm 中开发全栈 JavaScript 应用程序时，您通常会注意到代码补全在客户端代码中建议一些 Node.js API，在 Node.js 代码中建议 DOM API。这是因为 HTML 库（含 DOM API）和 Node.js Core 库（含 Node.js API）默认在整个项目中启用。要消除无关的代码补全建议，您需要为这些库配置作用域。

按下 Ctrl+Alt+S 以打开设置，然后选择语言与框架｜JavaScript｜库。
库页面显示可用库列表。
清除已启用复选框中 HTML 与 Node.js 核心项目旁的勾选。
点击管理作用域。将打开 JavaScript 库使用作用域对话框。
要为 HTML 库配置作用域，请点击。
在打开的对话框中，选择客户端代码所在的文件夹，然后点击打开。
返回到 JavaScript 库使用作用域对话框，所选文件夹已添加到列表中。
在每个文件夹旁的库列表中选择 HTML。
要为 Node.js 核心库配置作用域，再次点击，添加包含服务端代码的文件夹，并为它们各自从库列表中选择 Node.js 核心。
现在 WebStorm 仅在所选项目文件夹中的文件内解析 HTML 与 Node.js Core 库中的条目，并在补全中进行建议。

您也可以通过相同方式配置自动创建的 node_modules 库的作用域，参阅配置 node_modules 库。

配置通过 CDN 链接添加的库

当通过 CDN 链接引用库 .js 文件时，它在运行时可用，但在 WebStorm 中不可见。要将此类库 .js 文件中的对象添加到补全列表中，请下载该文件并将其配置为外部库。

下载库

将光标置于指向该库的 CDN 链接上，按下 Alt+Enter ，然后从列表中选择下载库：
该库被下载到 WebStorm 缓存中（不会添加到项目中），并显示一个包含信息消息的弹窗：
在 JavaScript 库页面中，已下载的库已添加至列表：
在项目工具窗口 Alt+1 中，该库显示在外部库节点下：

更改库的可见性

默认情况下，WebStorm 会将下载的库标记为全局，这意味着您可以在任何其他 WebStorm 项目中启用并重复使用该库。要更改此默认设置，请在列表中选择下载的库，点击编辑，然后在打开的编辑库对话框中选择项目。

配置自定义第三方 JavaScript 库

假设您的项目中或机器上的其他位置有一个 JavaScript 框架文件，并且您希望 WebStorm 将其视为一个库，而不仅仅是您正在编辑的项目代码。

下载所需的框架文件。
按 Ctrl+Alt+S 打开设置，然后选择语言与框架｜JavaScript｜库。
在库页面上，点击添加。
在新建库对话框中，指定外部 JavaScript 库的名称。
点击添加按钮（），然后从列表中选择附加文件… 或附加目录…。
在文件浏览器中，选择包含已下载框架的文件或文件夹。
点击确定后，您将返回到库页面，新库会添加至列表中。
在项目工具窗口 Alt+1 中，该库显示在外部库节点下。