Vue.js ESLint总是抛出键间距错误

我的.eslintrc中有以下内容：

'key-spacing': [ 'error', {
    'singleLine': {
        'beforeColon'   : false,
        'afterColon'    : true
    },
    'multiLine': {
        'beforeColon'   : false,
        'afterColon'    : true,
        'align'         : 'colon'
    }
}]

目标是确保在对象分配中以下内容为真：

在单行赋值中，每个冒号前没有空格， 但之后还有一个

在多行赋值中，冒号水平排列，并且 每个冒号前后都有一个空格

奇怪的是以下三个代码片段：

1[来自my app.vue文件]

export default {
    name        : 'app',
    components  : {
        todos
    }
}

2[来自我的main.js文件]

new Vue({
    el      : '#app',
    render  : h => h( App )
})

const vm = new Vue({
    el      : document.createElement( 'div' ),
    render  : h => h( Hello )
})

3[来自我的Hello.spec.js文件]

new Vue({
    el      : '#app',
    render  : h => h( App )
})

const vm = new Vue({
    el      : document.createElement( 'div' ),
    render  : h => h( Hello )
})

键间距eslint规则上的每个投掷错误：

/Users/autoboxer/development/learning-vue/src/app.vue
    12:3  error  Missing space after key 'name'  key-spacing

/Users/autoboxer/development/learning-vue/src/main.js
    6:2  error  Missing space after key 'el'  key-spacing

/Users/autoboxer/development/learning-vue/test/unit/specs/Hello.spec.js
    7:4  error  Missing space after key 'el'  key-spacing

---

我无法从我的设置中找出为什么它们会导致列出的错误，因为每个指定的单词后面都有必要的空格，但是如果有任何帮助，我将不胜感激。

此规则的配置非常复杂。我想你要找的是这样的东西：

'key-spacing': [ 'error', {
    'singleLine': {
        'beforeColon' : false,
        'afterColon'  : true
    },
    "align": {
        "beforeColon" : true,
        "afterColon"  : true,
        "on"          : "colon"
    }
}]

然而，即使使用这种配置，ESLint也不允许冒号的任意位置。它们必须尽可能接近对象中最长的键名。因此，使用上述配置，您的代码必须更改为：

export default {
    name       : 'app',
    components : {
        todos
    }
}

---

这将与我提供的配置正确匹配。

此规则的配置非常复杂。我想你要找的是这样的东西：

'key-spacing': [ 'error', {
    'singleLine': {
        'beforeColon' : false,
        'afterColon'  : true
    },
    "align": {
        "beforeColon" : true,
        "afterColon"  : true,
        "on"          : "colon"
    }
}]

然而，即使使用这种配置，ESLint也不允许冒号的任意位置。它们必须尽可能接近对象中最长的键名。因此，使用上述配置，您的代码必须更改为：

export default {
    name       : 'app',
    components : {
        todos
    }
}

---

这将与我提供的配置正确匹配。

可能使用制表符？我正在使用制表符。奇怪的是，它在每种情况下都只抱怨顶线。所有三个文件都应该各抛出两个错误，但第一个对象成员是它唯一抱怨的对象。这就是问题所在，我需要使用空格而不是制表符来对齐它们。可能是使用制表符？我正在使用制表符。奇怪的是，它在每种情况下都只抱怨顶线。所有三个文件都应该各抛出两个错误，但第一个对象成员是它唯一抱怨的对象。这就是问题所在，我需要使用空格而不是制表符来对齐它们。谢谢Ilya，这肯定是我面临的问题的一半。另一半是我使用了制表符而不是空格。由于难以确定与选项卡的对齐方式，因此无法使用它们。这一期中有概述：谢谢伊利亚，这绝对是我面临的问题的一半。另一半是我使用了制表符而不是空格。由于难以确定与选项卡的对齐方式，因此无法使用它们。本期杂志概述了这一点：