VSCode ESLint on save Vue.js

Question

​

​

在vscode和vue.js中，我是ESLint的新手

我运行yarn add -D eslint eslint-plugin-vue，并将这个"eslint-plugin-vue": "^8.1.1"放在我的package.json中

我在文件夹的根部有一个文件

.eslintrc

{
    "extends": [
    "eslint:recommended",
    "plugin:vue/recommended"
    ],
    "rules": {
    "vue/html-self-closing": "off"
    }
}

我的settings.json里也有这个

"editor.codeActionsOnSave": {
      "source.fixAll.eslint": true
},
"vetur.validation.template": true,

我试过，故意拼错了component。

<script>
import Task from "./Task.vue"

export default {
    name: "Tasks",
    props: {
        tasks: Array
    },
    component: {
        Task
    }
}
</script>

当我保存文件时，它并没有阻止我并突出显示我拼错了。

​

​

我在这里做错了什么？

有人能帮我把我的VSCode和vue.js一起用吗？

Answer 1

我没有找到一种方法来防止这个特定的错误，但是将它添加到.eslintrc文件中的规则中会让您在下一次遇到麻烦。

"vue/no-restricted-component-options": [
        "error",
        {
            "name": "component",
            "message": "Use \"components\" instead."
        }
    ]