报错：Component name....multi-word-component-names——ESLint关闭校验的两种方法（简单好用）

报错如下：

ESLint校验在代码提交之前会进行一次检查。

作用是避免因为某个字段未定义或者因为命名不规范导致的服务崩溃，可以有效的控制项目代码的质量。

其进行自动检测的原因是因为我们在使用vue-cli创建项目使用了最新的vue/cli-plugin-eslint插件，引用了vue/multi-word-component-names规则，所以在编译的时候判定此次错误。

解决方案一：在根目录下找到vue.config.js文件（如果没有则新建一个），添加下面的代码

const { defineConfig } = require('@vue/cli-service')
module.exports = defineConfig({
  transpileDependencies: true,
  //关闭eslint校验
  lintOnSave: false
})

        但是官方并不建议直接关闭校验，因为此方法只是编译时不报错，如果使用vscode+eslint会在文件头标红提示，所以推荐下一种方式。

解决方案二：在ESlint的配置文件eslintrc.js中（如果没有在根目录下新建一个名为.eslintrc.js的文件，注意！最前面有个点）将以下代码复制进去，此方案是根据文件进行关闭规则，更适用。

module.exports = {
  root: true,
  env: {
    node: true
  },
  'extends': [
    'plugin:vue/essential',
    'eslint:recommended'
  ],
  parserOptions: {
    parser: '@babel/eslint-parser'
  },
  rules: {
    'no-console': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
    'no-debugger': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
  },
  overrides: [
        //这里是添加的代码
        { 
          files: ['src/views/index.vue','src/views/**/index.vue'],   // 匹配views和二级目录中的index.vue
          rules: {
          'vue/multi-word-component-names':"off",
          } //给上面匹配的文件指定规则
        },
    {
      //这就是匹配目录下的所有vue文件
      files: [
        '**/__tests__/*.{j,t}s?(x)',
        '**/tests/unit/**/*.spec.{j,t}s?(x)'
      ],
      env: {
        jest: true
      }
    }
  ]
}