javascript - 如何配置 ESLint 与 PhpStorm 一起自动修复 ESLint 错误

Question

我在 ESLint 配置文件中定义了一些规则。此文件附在

Preferences
  ->Languages and Frameworks
     ->JavaScript
       ->Code Quality Tools
         ->ESLint

而且我发现它工作正常，因为在代码编辑器中，当出现与它们不匹配的错误时，每个规则都会显示。当我使用“代码检查器”时也是如此

Code
  -> Inspect code

Inspector 发现所有错误并在底部的小窗口中显示它们。也有可能对每个错误应用自动修复，但是当我尝试这样做时，我被重定向到 PhpStorm 首选项部分的 ESLint 配置页面。它看起来像这样:

应该有一个链接，当我点击它时应该会自动修复它，但是有一个链接只会打开 ESLint 配置弹出窗口:

我怎样才能让它正常工作？我一直在尝试查看有关它的 PhpStorm 文档，但没有成功。

Answer 1

我还没有找到在任何 IDE (PhpStorm/Atom/Sublime/WebStorm) 中执行此操作的方法。但是，您可以通过命令行运行 eslint --fix 来修复一些问题。

您需要对 ESLint 有基本的了解，才能按照以下步骤操作:

1)安装ESlint:

全局:

npm i -g eslint eslint-config-airbnb

(Airbnb 的风格指南被广泛使用 - http://nerds.airbnb.com/our-javascript-style-guide/。)

或本地(首选):

如果您有本地 node_modules 目录，最好在本地安装。从您的项目目录运行此命令:

npm i --save-dev eslint eslint-config-airbnb

(然后您可以从 ./node_modules/.bin/eslint 运行 eslint)

2) 使用以下行在您的项目目录中创建一个 .eslintrc 文件。

{ "extends": "airbnb" }  // We installed airbnb's style guide in step 1.

3) 备份/提交您的源代码文件

备份你想要lint的文件；以下命令可能会更改几行。

4) 按如下方式运行 eslint --fix:

eslint --fix path/to/file.js

eslint --fix path/to/files/*.jsx

这将修复您文件中的 10 秒错误!

5) 如果 eslint --fix 因某些错误而停止，请手动修复它然后再次运行

我注意到 eslint --fix 并没有一次性修复所有错误。即它有时会运行到文件中的特定点，然后在无法自动处理的错误处停止。

如果您删除了 eslint 卡住的最重要问题，再次运行该命令可以修复文件中的更多错误。冲洗，重复。

--

eslint 在 2015 年添加了一些新功能。希望 '--fix' 选项在未来变得更好:http://eslint.org/blog/2015/09/eslint-v1.5.0-released