如何仅对一个 .vue 文件禁用 vue/multi-word-component-names eslint 规则？答案

【问题标题】：How to disable vue/multi-word-component-names eslint rule for just one .vue file?如何仅对一个 .vue 文件禁用 vue/multi-word-component-names eslint 规则？
【发布时间】：2022-01-03 20:16:37
【问题描述】：

我正在使用Vue ESLint plugin，它有一个not allowing single word component names. 的规则

但是，我也在使用 Nuxt，并且要在 Nuxt 中使用 set a default Layout，您需要一个名为 default.vue 的 .vue 组件，它会引发 ES Lint 规则错误。

我似乎无法在那个实际上很小的 .vue 文件中禁用它...

<template>
    <div>
        <Header/>
        <Nuxt/>
    </div>
</template>

但是，如果我在 .eslintrc.js 中禁用该规则，它就会起作用。

module.exports = {
  root: true,
  env: {
    browser: true,
    node: true,
  },
  extends: [
    '@nuxtjs/eslint-config-typescript',
    'plugin:nuxt/recommended',
    'prettier',
  ],
  plugins: [],
  // add your custom rules here
  rules: {
    'vue/multi-word-component-names': 'off',
  },
}

有没有办法只对一个 Vue 文件禁用规则？

【问题讨论】：

这能回答你的问题吗？ Turning off eslint rule for a specific file
FWIW，这条规则完全不切实际，可能永远被禁用。
这里标记为必不可少：vuejs.org/v2/style-guide/#Multi-word-component-names-essential

标签： vue.js vuejs2 nuxt.js eslint eslintrc

【解决方案1】：

在你的情况下，你可以替换

'vue/multi-word-component-names': 'off'

与：

'vue/multi-word-component-names': ['error', {
  'ignores': ['default']
}]

这会将规则设置为“允许”所有名为“默认”的文件

您可以在此处阅读更多信息：https://eslint.vuejs.org/rules/multi-word-component-names.html

【讨论】：

谢谢，它正在工作。

【解决方案2】：

rules: { 'vue/multi-word-component-names': 0 } 试试这个方法

【讨论】：

这在功能上不等同于现有答案吗？
@JeremyCaney 和哪一个一样？ 0 不关闭
这对我有用。谢谢

【解决方案3】：

vue.config.js 文件的下面一行：

module.exports = defineConfig({
  ....
  lintOnSave: false
})

【讨论】：

【解决方案4】：

在你的情况下，你可以替换

vue.config.js

与：

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

【讨论】：