Node.js 如何在WebStorm/PHPStorm中配置ESLint自动修复保存？

我正在尝试在WebStorm中创建一个自定义文件监视程序，它将在保存时自动修复ESLint错误。在

Settings>Tools>filewatchers

中，我使用以下设置创建了一个新的文件查看器：

• 文件类型：

  Any

• 范围：

  所有地方

• 程序：

  /home/user/Projects/todo app/eslint autofix.sh

• 参数：空白
• 要刷新的输出路径：空白
• 其他选项>工作目录：

  /home/user/Projects/todo-app

eslint autofix.sh:

#!/usr/bin/env bash

./node_modules/.bin/eslint --fix

然后我犯了一个ESLint错误，并按下Ctrl+S进行保存。弹出以下错误：

/home/user/Projects/todo-app/eslint-autofix.sh
/usr/bin/env: ‘node’: No such file or directory

如何修复此错误？

根据文章，设置应如下所示：

• 文件类型：任意（或JavaScript）
• 范围：项目文件
• 程序：$ProjectFileDir$/node\u modules/.bin/eslint
• 参数：--fix$FilePath$
• 要刷新的输出路径：$FileDir$

---

仅扩展jstice4all和gotjosh的解决方案：

我能够让FileWatcher在一些项目中使用ESLint，但它不能与插件extends:'@react native community'

@react-native-community/eslint-config#overrides[2]:
    Environment key "jest/globals" is unknown

事实证明，@react native community plugin需要从项目文件夹本身运行，以便加载环境变量，而文件监视程序则从node_module/eslint路径运行。要使其工作，我必须添加以下配置：

• 工作目录：$ProjectFileDir$

---

在

WebStorm 2020.1.1

上，有一个名为

Run eslint--fix On save

的复选框

另见：

---

内置的ESLint集成不适合您吗？它位于文件|设置|语言与框架| JavaScript |代码质量工具| ESLintIt下。但是我想在保存时自动修复ESLint错误，这样我就不必手动运行

ESLint--fix

。尝试从终端启动PhpStorm-问题是否仍然存在？为了避免使用绝对路径：$ProjectFileDir$/node\u modules/.bin/ESLint，我还建议不要对linting/prettier使用高级自动保存选项（然后在您仍在键入时重新格式化）-还要注意，webstorm将JSX和javascript视为不同的文件类型，并且您只能为观察者选择一种文件类型（因此我为javascript和JSX制作了一个副本）说得好，谢谢。我会用你的解决方案更新我的答案。相同的设置在

WebStrom 2020.3.1

@谢谢