ESLint > 自动美化和空格缩进

Question

我刚刚意识到有比JSLint更好的东西，但我对它有点麻烦。 我指的是ESLint 。

我正在为VS Code设置它，使用Dirk Ba​​eumer的官方插件。

到目前为止，一切都运行良好，直到我遇到indent设置。

我正在为我的编辑器使用自定义的自动美化设置，它在保存时默认为 4 个空格/制表符缩进。

由于集成的代码约定类型，我从 ESLint 收到 2 个错误：

[ESLint] Expected indentaion of 2 spaces but found 4. (indent)

而且，对于其他一些情况，我得到以下信息：

[ESLint] Expected indendation of 6 spaces but found 8. (indent)

等等.. 10 但 12 , 12 但 14 ......你明白了。

如何将文档中的所有缩进默认为 4 个空格？

我当前的.eslintrc设置：

{
"extends": [
    "eslint:recommended"
],
"root": true,
"rules": {
    // '===' instead of '==' rule
    "eqeqeq": [2, "allow-null"],
    // ^^^ '===' instead of '==' rule
    "indent": [2, 4],
    "quotes": [2, "single"],
    "semi": [2, "always"],
    "no-console": 0
},
"env": {
    "es6": false,
    "browser": true,
    "commonjs": true,
    "node": false,
    "jquery": true
}
}

我的"indent": [2, 4],没有按照我期望的方式工作。

参考示例代码：

window.setTimeout(function () {

'use strict';
$(document).ready(function () {
    var current_width = $(window).width();
    if (current_width <= 481) {
        $('.widget-form-list').addClass('supv');
        $('.widget-form-item').addClass('supv-form-item');
    }
})
// window resize
$(window).resize(function () {
    var current_width = $(window).width()
    if (current_width < 481) {
        $('.widget-form-list').addClass('supv')
        $('.widget-form-item').addClass('supv-form-item')
    }
})
}, 1000)

Answer 1

ESLint 配置是级联的。 这意味着您可以在不同的子目录中拥有多个.eslintrc文件，它们将在 lint 时合并。 您的indent规则配置看起来是正确的，但根据您收到的错误消息，很可能 - 它被将默认缩进空格数设置为 2 的某些内容覆盖。

要弄清楚发生了什么，您可以在 ESLint 中使用两个不同的命令。 首先，您可以使用print-config选项运行（从命令行）ESLint。 它需要一个文件来 lint，并且它将输出 ESLint 将用于该文件的计算配置。 验证在该配置中缩进设置为 [2, 4]。 如果不是，您可以使用 调试标志运行 ESLint，它应该打印出所有正在使用的配置文件的位置。 这应该会告诉你哪个文件覆盖了你的默认配置。

Answer 2

问题已解决。

问题在于，在使用终端配置.eslintrc文件时，它以某种方式在我的*/js/目录中自行创建了另一个.eslintrc文件，其中包含一些覆盖我的*/root/文件的默认设置。

如果您遇到同样的问题 - 在您的项目文件夹中搜索第二个.eslintrc文件。