WebStorm 是几乎所有前端开发人员的首选开发环境之一。而 ESLint 是一种常见的 JavaScript 代码检查工具，它可以帮助开发人员在编写代码时发现潜在的问题，提高代码质量。
然而，有时候在编写 JavaScript 代码时会出现一些严重的语法错误和字面量错误，导致代码无法正常运行。这时候，我们需要一种能够自动修复这些错误的工具。ESLint 就提供了一个非常强大的功能：自动修复。本文将介绍如何在 WebStorm 中配置 ESLint 的自动修复功能。
安装 ESLint 插件
首先，你需要确认你的 WebStorm 中已经安装了 ESLint 插件。打开 WebStorm，在菜单栏中选择 File -> Settings，在左侧导航栏中选择 Plugins，然后在右侧搜索框中搜索 "ESLint" 插件。如果还没有安装，点 "Install" 安装即可。
开启 ESLint 自动修复功能
开启 ESLint 的自动修复功能非常简单，只需要在 WebStorm 中配置一些常规设置即可。在菜单栏中选择 File -> Settings，在左侧导航栏中选择 Languages & Frameworks -> JavaScript -> Code Quality Tools -> ESLint。
勾选 “Enable” 选项并选择自己的 ESLint 配置文件（.eslintrc.js 或者 .eslintrc.json），然后勾选 “Run eslint --fix on save” 选项。如图所示：
现在，每次保存文件时，ESLint 就会自动修复你的代码中的语法错误和字面量错误。你甚至可以在 WebStorm 的工具栏中手动运行此功能。
示例代码
以下是一段示例代码，其中包含了一些 ESLint 错误。当保存这个文件时，ESLint 将自动修复这些错误。
-- -------
-------- ------------- -
--- --- - --
--- --- - ------
--- - ----
----- ---- - ----- -----
-- ---- -- -- -
----------------- ---- -- ----- ------------
-
---------------- ----- -- --- ----- -----
-
--------------如果你已经正确配置了 WebStorm 和 ESLint，那么当你保存这个文件时，WebStorm 将自动修复错误代码，修复后的代码如下：
-- -------
-------- ------------- -
--- --- - --
--- --- - ------
--- - --
----- ---- - ----- -----
-- ---- --- -- -
----------------- ---- -- ----- ------------
-
---------------- ----- -- --- ----- -----
-
--------------结论
WebStorm 中 ESLint 的自动修复功能可以帮助开发者保持高质量的代码。我们希望本文的指南能够帮助你在 WebStorm 中正确配置并使用 ESLint 的自动修复功能。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/6701fcbaf59b73a932a48291