PyCharm 2025.3 Help

配置 JavaScript 库

在语言和 IDE 的语境中, 是一个文件或一组文件。 除了 PyCharm 从您编辑的项目代码中获取的函数和方法之外,这些文件的函数和方法也会添加到 PyCharm 的内部知识库中。 在项目的作用域内,项目中的库默认为写保护状态。

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

下载 TypeScript 社区存根(TypeScript 定义文件)

在 PyCharm 中,可以将 DefinitelyTyped 存根 配置为库并加以使用,这在以下情况下特别有用:

  • 用于改进代码补全、解析对 PyCharm 静态分析来说过于复杂的库或框架中的符号,并为此类符号添加类型信息。

  • 用于解析来自测试框架的全局定义的符号。

下面的示例展示了来自 Express 应用程序的一段代码,其中 post() 函数无法解析:

未安装 d.ts 时无法解析符号

在您安装 TypeScript 定义文件后, PyCharm 成功解析 post()

安装 d.ts 后符号已解析

使用 PyCharm ,您可以直接在编辑器中通过意图操作下载 TypeScript 定义文件,也可以在 设置:JavaScript 库 页面进行下载。

使用意图操作下载 TypeScript 定义

  • 将插入符号置于引用此库或框架的 importrequire 语句上,按 Alt+Enter ,然后选择 安装TypeScript 定义以提供更好的类型信息

    下载 TypeScript 定义的意图操作

    PyCharm 下载该库的类型定义,并将其添加到 JavaScript。 库 页面上的库列表中:

    类型定义库已添加到列表
  • 或者,打开您的 package.json ,将插入符号置于要为其下载类型定义的包上,按 Alt+Enter ,然后选择 安装 '@types/<package name>'

    从 package.json 安装类型定义

在 JavaScript 库页面下载 TypeScript 定义

  1. Ctrl+Alt+S 打开设置,然后选择 语言与框架 | JavaScript | 库

  2. 页面打开后,点击 下载 ,并在打开的 下载库 对话框中,选择所需的库,然后点击 下载并安装

    添加 TypeScript 定义文件

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

下载的类型定义显示在外部库节点下

可选

配置 Node.js Core 库

要为编译到 Node.js 二进制中的 fspathhttp 等核心模块提供代码补全和引用解析,您需要将 Node.js Core 模块源配置为 JavaScript 库。

  1. Ctrl+Alt+S 打开设置,然后选择 语言与框架 | JavaScript 运行时

  2. 确保在 首选运行时 字段中选择了 Node.js

  3. Node.js 运行时 列表中选择所需的 Node.js 安装。

  4. 选中 Node.js 编码协助 (A) 复选框。

    请注意,Node.js Core 库是特定于版本的。 因此,如果您在 JavaScript 运行时 页面上更改了您的 Node.js 版本,则需要再次选中该复选框。 之后, PyCharm 将为此新版本创建一个新库。

配置 node_modules 库

为项目依赖项提供代码补全, PyCharm 会自动创建一个 node_modules 库,这样 Node.js 模块会保留在您的项目中,但不会对其运行任何检查,从而提升性能。

node_modules 库已添加到列表

项目 工具窗口 Alt+1 中, node_modules 也被标记为库:

node_modules 文件夹标记为库根目录.png

但是, node_modules 库包含的仅是您项目 package.json 文件的 dependencies 对象中列出的模块。 PyCharm 不会将依赖的依赖项包含到 node_modules 库中,而是将它们从项目中排除。

配置库的作用域

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

  1. Ctrl+Alt+S 打开设置,然后选择 语言与框架 | JavaScript | 库

    页面显示可用库列表。

  2. 清除所需库旁的 已启用 复选框的勾选,然后点击 管理作用域JavaScript 库。 使用范围 对话框打开。

  3. JavaScript 库用法作用域 对话框中,点击 添加 按钮( ),并选择要包含在库作用域中的文件或文件夹。 在 JavaScript 库用法作用域 对话框中, 路径 字段显示所选文件或文件夹。

  4. 对于每个添加的文件或文件夹,从 列表中选择您正在配置的库。

示例:为 HTML 和 Node.js Core 库配置作用域

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

  1. Ctrl+Alt+S 打开设置,然后选择 语言与框架 | JavaScript | 库

    页面显示可用库列表。

    配置 JavaScript 库:可用库列表
  2. 清除 HTMLNode.js 核心 项旁的 已启用 复选框的勾选。

    清除 Node.js Core 和 HTML
  3. 点击 管理作用域JavaScript 库使用范围 对话框打开。

  4. 要为 HTML 库配置作用域,点击 app.general.add.png

    为 HTML 添加作用域

    在对话框打开后,选择包含客户端代码的文件夹,然后点击 打开

    为 HTML 添加作用域:选择文件夹

    您返回到 JavaScript 库使用范围 对话框,所选文件夹已添加到列表中。

    管理作用域对话框:已添加 HTML 库的文件夹

    从每个文件夹旁的 列表中,选择 HTML

    指定作用域:已选择 HTML 库
  5. 要为 Node.js 核心 库配置作用域,再次点击 ,添加包含服务端代码的文件夹,并从每个文件夹旁的 列表中选择 Node.js 核心

    指定作用域:已选择 Node.js Core 库

    现在,PyCharm 仅在这些所选项目文件夹中的文件中解析来自 HTML 和 Node.js Core 库的内容,并在代码补全中提供它们。

同样地,您可以为自动创建的 node_modules 库配置作用域,参阅 配置 node_modules 库

配置通过 CDN 链接添加的库

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

下载库

  • 将插入符号置于该库的 CDN 链接上,按 Alt+Enter ,并从列表中选择 下载库

    意图操作:下载 CDN 库

    该库会下载到 PyCharm 缓存(但不会下载到您的项目中),并会出现一个包含信息的弹出窗口:

    已添加 CDN 库

    JavaScript 库 页面,下载的库已添加到列表:

    CDN 库已添加到列表

    项目 工具窗口 Alt+1 中,库显示在 外部库 节点下:

    下载的 CDN 库显示在外部库节点下

更改库的可见性

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

    配置库的可见性

配置自定义第三方 JavaScript 库

假设您的项目或计算机上的其他位置有一个 JavaScript 框架文件,并且您希望 PyCharm 将其视为库,而不仅仅是您编辑的项目代码。

  1. 下载所需的框架文件。

  2. Ctrl+Alt+S 打开设置,然后选择 语言与框架 | JavaScript | 库

  3. 页面,点击 添加

  4. 新建库 对话框,指定外部 JavaScript 库的名称。

  5. 点击 添加 按钮(app.general.add.png ),并选择 附加文件…附加目录…

    配置自定义库:添加文件/文件夹

    在文件浏览器中,选择已下载的框架文件或文件夹。

    配置自定义库:已添加库

    当您点击 确定 ,您返回到 页面,新库已添加到列表中。

    新的自定义库已添加到列表
  6. 项目 工具窗口 Alt+1 中,库显示在 外部库 节点下。

    自定义库显示在外部库节点下

可选

  • 默认情况下,该库在整个当前项目的作用域内启用。 您可以更改此默认设置,具体请参阅 配置库的作用域

  • 文档URLs 区域,指定库或框架官方文档的路径。 PyCharm 将在您在该库的符号上按 Shift+F1 时打开此 URL。

查看与文件关联的库

  • 在编辑器中打开该文件,按 Ctrl+Shift+A ,然后从列表中选择 使用 JavaScript 库

    查看关联的 JS 库:查找操作

    PyCharm 显示可用的已配置库列表。 与当前文件关联的库会以勾号标记。

    查看关联的 JS 库:弹出列表
    • 要将当前文件从库的作用域中移除,清除该库旁的勾号。

    • 要将库与当前文件关联,在该库旁打勾。

删除库

  1. Ctrl+Alt+S 打开设置,然后选择 语言与框架 | JavaScript | 库

    页面显示可用库列表。

  2. 选择一个库,然后点击 移除

最后修改日期: 2025年 12月 2日