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

Question

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

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

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

Code
  -> Inspect code

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

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

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

score 9 · Accepted Answer

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

您需要对 ESLint 有基本的了解，才能执行以下步骤：

1）安装ESlint：

在全球范围内：

npm i -g eslint eslint-config-airbnb

或本地（首选）：

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

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

（然后您可以eslint从运行./node_modules/.bin/eslint）

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

{ "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

score 2 · Accepted Answer

您可以添加快捷方式来运行 ESLINT 。我为 phpstrom 做了相同的设置。在我的最后工作正常

同样对于自动保存修复，你可以参考这个

2 回答 2