TypeScript 代码检查
针对 TypeScript 代码的推荐代码检查工具是 ESLint ,它提供了广泛的代码检查规则,并且可以通过插件扩展。 PyCharm 会在编辑器中直接显示 ESLint 报告的警告和错误,您在输入时即可看到。 详细了解请参阅 ESLint。
当在项目的 ESLint 配置中将 @typescript-eslint/parser 设置为解析器时,PyCharm 会高亮显示 .ts 和 .tsx 文件中由 ESLint 报告的错误。 详细了解请参阅 typescript-eslint 存储库中的 README 文件。
开始之前
请确保您的计算机上已安装 Node.js。
如 配置本地 Node.js 解释器、 在 Windows Subsystem for Linux 上使用 Node.js 或 配置远程 Node.js 运行时 中所述,在您的项目中配置 Node.js 运行时。
安装 ESLint
ESLint 9 及更高版本
在嵌入的 终端 (Alt+F12 )中,键入:
npm install --save-dev eslint @eslint/js typescript typescript-eslintpnpm add --save-dev eslint @eslint/js typescript typescript-eslintyarn add --dev eslint @eslint/js typescript typescript-eslint
详细了解请参阅 typescript-eslint 官方网站。
ESLint 8 及更早版本
在嵌入的 终端 (Alt+F12 )中,键入:
npm install --save-dev @typescript-eslint/parser @typescript-eslint/eslint-plugin eslint typescriptpnpm add --save-dev eslint @eslint/js typescript-eslintyarn add --dev eslint @eslint/js typescript-eslint
详细了解请参阅 typescript-eslint 官方网站。
配置文件
根据您使用的 ESLint 版本,PyCharm 可在以下文件类型中识别配置:
ESLint 9 及更高版本
eslint.config.js 、 eslint.config.mjs 或 eslint.config.cjs (扁平格式),详细了解请参阅 ESLint 官方网站。
您还可以使用用 TypeScript 编写的配置文件,例如 eslint.config.ts 、 eslint.config.mts 或 eslint.config.cts 。 为此,您需要指定 unstable_ts_config 标志。
按 Ctrl+Alt+S 打开设置,然后选择 。
选择 手动 ESLint 配置。
在 额外的 eslint 选项 字段中,输入
--flag unstable_ts_config。点击 应用 以保存更改并关闭对话框。
ESLint 8 及更早版本
.eslintrc.* ( .eslintrc 、 .eslintrc.json 或 .eslintrc.yaml 文件,或其他受支持格式的文件)。
.eslintignore
package.json ,其中包含
eslintIgnore或eslintConfig属性。 此配置系统已弃用,详细了解请参阅 ESLint 官方网站。
请参阅 ESLint 配置迁移指南 ,了解如何切换到扁平格式。
创建并编辑配置文件
打开配置文件,或在项目根目录中创建一个新配置文件。 根据您使用的 ESLint 版本填写配置文件:
// @ts-check import eslint from '@eslint/js'; import tseslint from 'typescript-eslint'; export default tseslint.config( eslint.configs.recommended, tseslint.configs.recommended, );详细了解请参阅 typescript-eslint 官方网站。
/* eslint-env node */ module.exports = { extends: ['eslint:recommended', 'plugin:@typescript-eslint/recommended'], parser: '@typescript-eslint/parser', plugins: ['@typescript-eslint'], root: true, };详细了解请参阅 typescript-eslint 官方网站。
在 PyCharm 中配置 ESLint
默认情况下,ESLint 会 自动配置。 您也可以选择 手动指定所有配置设置,或禁用 ESLint。
详细了解请参阅 ESLint。
使用 ESLint 抑制对 TypeScript 代码的检查
如果您已经在使用
@typescript-eslint/parser,但不希望使用 ESLint 检查 TypeScript 代码,请将 .ts 或 .tsx 添加到 .eslintignore 文件中。
检查您的代码
安装并启用后,ESLint 会在您每次打开 TypeScript 文件时自动激活。 您还可以将 ESLint 配置为 在保存时自动检测并修复问题。
默认情况下,PyCharm 会根据 ESLint 配置中的严重性级别标记检测到的问题。 请参阅 配置 ESLint 高亮显示 以了解如何覆盖这些设置。
当前文件中检测到的错误的描述及其快速修复可在编辑器中以及在 问题 工具窗口的 文件 选项卡中查看。
所有先前打开的文件中的错误及其快速修复将显示在 问题 工具窗口的 项目错误 选项卡中。 要打开该工具窗口,请点击编辑器右上角的 检查 小部件:

有关更多信息,请参阅 在编辑器中查看问题并应用快速修复 和 “问题” 工具窗口。
要在编辑器中查看问题的描述,请将鼠标悬停在高亮显示的代码上。

要解决检测到的问题,请点击 ESLint:修复 '<rule name>' 或按 Alt+Shift+Enter。
要解决当前文件中检测到的所有问题,请点击 更多操作 (Alt+Enter ),然后在列表中选择 。

或者,打开 问题 工具窗口的 文件 选项卡 Alt+6 ,在其中您可以查看问题描述、应用快速修复、导航到源代码中出现错误的片段,并且无需离开该工具窗口即可在 编辑器预览 窗格中修复它们。

详细了解请参阅 “问题” 工具窗口。
您还可以将 ESLint 配置为在保存文件时修复该文件中的所有问题。 要配置此行为,请在 设置 对话框的 ESLint 页面上选择 在保存时运行 eslint --fix 复选框,如 在 PyCharm 中激活并配置 ESLint 中所述。
详细了解请参阅 在编辑器中查看问题并应用快速修复 以及 ESLint。
TSLint
您还可以在 PyCharm 中使用 TSLint 代码验证工具,在不运行应用程序的情况下检查 TypeScript 代码中的最常见错误。 启用该工具后,它会对所有已打开的 TypeScript 文件进行检查,并标记检测到的问题。
要查看问题的描述,请将鼠标悬停在高亮显示的代码上。 默认情况下,PyCharm 会根据 TSLint 配置文件中的严重性级别标记检测到的问题。 请参阅 配置 TSLint 高亮显示 以了解如何覆盖这些设置。

开始之前
请确保您的计算机上已安装 Node.js。
请确保在您的项目中配置了本地 Node.js 运行时:打开 设置 对话框(Ctrl+Alt+S ),然后转到 。 Node 运行时 字段显示项目的默认 Node.js 运行时。 详细了解请参阅 配置本地 Node.js 解释器。
请确保在 设置 | 插件 页面, 已安装 选项卡上已启用必需的 JavaScript and TypeScript 和 TSLint 插件。 有关详细信息,请参阅 管理插件。
安装 TSLint
在嵌入的 终端 (Alt+F12 )中,键入:
npm install tslint typescript --save-dev详细了解请参阅 TSLint 官方网站。
创建 TSLint 配置文件
在嵌入的 终端 (Alt+F12 )中,键入:
cd <project root> tslint --init
在 PyCharm 中启用并配置 TSLint
默认情况下,PyCharm 会使用项目 node_modules 文件夹中的 TSLint 包,以及存储当前文件的文件夹中的 tslint.json 配置文件。 如果在当前文件所在的文件夹中找不到 tslint.json 配置文件,PyCharm 会在其父文件夹中继续查找,直至项目根目录。
如果您有多个 package.json 文件将 TSLint 列为依赖项,PyCharm 会为每个 package.json 启动一个单独的进程,并处理其下的所有内容。 这使您能够将特定的 TSLint 版本或特定的一组插件应用到单一存储库或具有多个 TSLint 配置的项目中的每个路径。
在所有新的 PyCharm 项目中,此行为为默认设置。 要在先前创建的项目中启用它,请在 设置 对话框(Ctrl+Alt+S )中转到 ,并选择 自动 TSLint 配置 选项。
您还可以手动配置 TSLint,以使用自定义的 TSLint 包和 tslint.json ,并指定一些附加规则。
在 设置 对话框(Ctrl+Alt+S )中,转到 。
选择 手动配置 选项。
指定 TSLint 包的路径。
在 配置文件 区域,指定要使用的配置。
默认情况下,PyCharm 会首先查找一个 tslint.json 、 tslint.yaml 或 tslint.yml 配置文件。 PyCharm 会从要检查的文件所在的文件夹开始查找,然后在父文件夹中继续查找,直至项目根目录。 如果未找到 tslint.json 、 tslint.yaml 或 tslint.yml 配置文件,TSLint 会使用其默认的内置配置文件。 因此,您必须在 tslint.json 、 tslint.yaml 或 tslint.yml 配置文件中,或在自定义配置文件中定义要应用的配置,或者依赖默认的内置配置。
要让 PyCharm 查找一个 tslint.json 、 tslint.yaml 或 tslint.yml 文件,请选择 自动搜索 选项。
要使用自定义文件,请选择 配置文件 选项,并在 路径 字段中指定该文件的位置。 从列表中选择路径,或手动输入,或者点击
,然后在打开的对话框中选择相应的文件。
了解有关配置 TSLint 的更多信息,请参阅 TSLint 官方网站。
如有必要,请在 附加规则目录 字段中指定附加代码验证规则文件的位置。 这些规则将在来自 tslint.json 、 tslint.yaml 、 tslint.yml 或上述指定的自定义配置文件的规则之后应用,并相应地覆盖它们。
为 TSLint 配置高亮显示
默认情况下,PyCharm 会根据 TSLint 配置文件中的严重性级别标记检测到的错误和警告。 例如,错误以红色波浪线突出显示,而警告以黄色背景标记。 有关更多信息,请参阅 代码检查 和 更改检查严重性。
在 TSLint 配置中更改规则的严重性级别
在 TSLint 配置文件中,找到您要编辑的规则,并将其 ID 设置为
warning或error。 详细了解请参阅 TSLint 官方网站。
您可以覆盖 TSLint 配置文件中的严重性级别,使 PyCharm 忽略它们,并将 linter 报告的所有内容显示为错误、警告,或以自定义颜色显示。
忽略配置中的严重性级别
在 设置 对话框(Ctrl+Alt+S )中,转到 。 检查页面 将打开。
在中央窗格中,转到 JavaScript 和 TypeScript | 代码质量工具 | TSLint。
在右侧窗格中,清除 使用配置文件中的规则严重性 复选框,并选择用于替代默认级别的严重性级别。

从 TSLint 配置文件导入代码风格
PyCharm 能够识别在 tslint.json 、 tslint .yaml 或 tslint.yml 配置文件中描述的某些 TSLint 规则,并让您将其应用到项目中的 TypeScript 代码风格配置。
当您首次打开项目时,PyCharm 会自动从项目 tslint.json 、 tslint.yaml 或 tslint.yml 导入代码风格。
如果 tslint.json 、 tslint.yaml 或 tslint.yml 已更新(手动或通过您的版本控制),请在编辑器中将其打开,并在上下文菜单中选择 应用 TSLint 代码样式规则。

TSLint 快速修复
PyCharm 让您可以自动修复 TSLint 报告的某些问题。

要修复特定错误,请将插入符号置于高亮显示的代码处,按 Alt+Enter ,然后在列表中选择 TSLint:修复 '<current error>'。
要修复文件中检测到的所有问题,请选择 TSLint:修复当前文件。
您可以针对当前文件,甚至针对当前行,抑制 TSLint 规则。 PyCharm 自动生成格式为 /* tslint:disable:<rule name> 或 // tslint:disable-next-line:<rule name> 的禁用注释,并分别将其放在文件顶部或当前行上方。

即时抑制 TSLint 规则
将插入符号置于 TSLint 报告的错误或警告处,按 Alt+Enter。
选择要禁用的规则的快速修复,并按 Right。
从列表中选择 在当前文件中抑制 <rule name> 或 在当前行中抑制 <rule name>。