使用 ESLint 的 --fix 标志

Question

ESLint的 --fix option 告诉 ESLint 修复代码中它知道如何修复的任何错误。

入门

例如，ESLint 的推荐配置使用 no-extra-boolean-cast 规则 ，删除不必要的 !! 在 if 声明。 例如，假设您有以下内容 test.js 文件。 这 !! 在里面 if 语句是不必要的，因为 JavaScript if 语句已经检查 真值 。

if (!!(typeof window === 'undefined')) {
  console.log('Hello from Node.js!');
}

假设你有以下 .eslintrc.json 配置文件：

{ 
  "parserOptions": {
    "ecmaVersion": 2020
  },
  "rules": {
    "no-extra-boolean-cast": "error"
  }
}

ESLint 会报“Redundant double negation”错误：

$ ./node_modules/.bin/eslint ./test.js 

/scratch/test.js
  1:5  error  Redundant double negation  no-extra-boolean-cast

✖ 1 problem (1 error, 0 warnings)
  1 error and 0 warnings potentially fixable with the `--fix` option.

$ cat ./test.js 

注意 1 error and 0 warnings potentially fixable with the --fix option 线。 这告诉你 ESLint 知道如何修复这个错误。 跑 ./node_modules/.bin/eslint --fix ./test.js 然后那个错误就消失了。

$ ./node_modules/.bin/eslint --fix ./test.js 
$ 
$ cat ./test.js
if (typeof window === 'undefined') {
  console.log('Hello from Node.js!');
}

请注意，ESLint 删除了不必要的 !! .

ESLint 只能自动修复某些 ESLint 规则的违规行为。 ESLint 的规则页面 有一个完整的内置 ESLint 规则列表，并解释了它可以自动应用修复的规则。

使用 npm 脚本

运行 ESLint 开发人员经常使用npm run 。 如何通过 npm 脚本运行带有修复的 ESLint 是 StackOverflow 上的一个常见问题。

例如，假设您的 package.json 文件包括以下几行：

"scripts": {
  "lint": "eslint ."
}

为了运行 eslint --fix ，你需要运行 npm run lint -- --fix . 注意额外的 -- . 你只需要 -- 如果你在 npm 脚本中运行 ESLint！