如何抑制错误：混合空格和制表符？

Question

我在Vue.js 应用程序中收到了这个烦人的“错误”消息。

error: Mixed spaces and tabs (no-mixed-spaces-and-tabs) at src/components/Landing.vue:388:2:

我想知道如何抑制它？

Answer 1

这是一个ESLint error (no-mixed-spaces-and-tabs)，旨在警告不要同时使用空格和制表符来缩进代码。空格/制表符的一致性是一种代码约定，这在团队内共享代码库时很重要 (1) (2)。如果您是单独使用它（并且没有其他计划），请随意禁用/启用您想要的任何规则。

禁用每个项目的规则

您可以将 ESLint 配置为在整个项目中忽略该错误。配置通常存储在 Vue CLI 生成的项目中的.eslintrc.js 中。在该文件中，编辑 rules 对象以包含：

// .eslintrc.js
module.exports = {
  "rules": {
    "no-mixed-spaces-and-tabs": 0, // disable rule
  }
}

禁用每行规则

要仅忽略单行的该错误，请在该行上使用内联注释 (eslint-disable-line no-mixed-spaces-and-tabs or eslint-disable-next-line no-mixed-spaces-and-tabs)：

⋅⋅const x = 1
⇥⋅⋅const y = 2 // eslint-disable-line no-mixed-spaces-and-tabs

// eslint-disable-next-line no-mixed-spaces-and-tabs
⇥⋅⋅const z = 3

按部分禁用规则

要忽略多行代码的该错误，请在代码周围加上eslint-disable no-mixed-spaces-and-tabs 和eslint-enable no-mixed-spaces-and-tabs multi-line cmets：

⋅⋅const x = 1

/* eslint-disable no-mixed-spaces-and-tabs */
⇥⋅⋅const y = 2  // ?
⇥⋅⋅const z = 3  // ?
/* eslint-enable no-mixed-spaces-and-tabs */

⇥⋅⋅const q = 4  // ❌ error: mixed spaces and tabs!

Answer 2

转至view option，然后转至indentation，您将找到indent using space。你的问题应该得到解决。如果没有修复，请转到convert indention to spaces。

Answer 3

通过修复这些代码样式问题。

这违反了ESLint 规则。它对您的代码是否实际运行没有影响，但它会警告您源代码的格式不理想。

这意味着在您的代码indentation（它们是不可见的字符）中，您使用的是制表符和空格的组合。

应该是其中之一。因此，请确保您始终使用 任一 制表符或空格，但不要同时使用两者。

大多数 IDE 都有将制表符转换为空格或反之亦然的选项，以转换现有代码以使其符合此规则。

否则@tony19's answer 有你覆盖。