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

Posted 2023-03-27

技术标签:

【中文标题】如何抑制错误：混合空格和制表符？【英文标题】：How to supress error: Mixed spaces and tabs? 【发布时间】：2019-02-15 13:15:17 【问题描述】：

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

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

我想知道如何抑制它？

【问题讨论】：

使用 VS Code 或 WebStorm 等完全不包含选项卡的 IDE，所有选项卡都将转换为空格。我习惯了sublime text，不想因为这个愚蠢的错误而改变IDE。然后设置 Sublime 用空格替换制表符。这是什么原因？我们不在 python 中，那么为什么差异很重要？ @Babr Consistency 的空格/制表符是一种代码约定，这在(1)(2) 团队内共享代码库时很重要。如果您是单独使用它（并且没有其他计划），请随意禁用/启用您想要的任何规则。 :-) 【参考方案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!

【讨论】：

【参考方案2】：

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

【讨论】：

【参考方案3】：

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

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

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

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

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

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

【讨论】：