この迷惑な「エラー」メッセージがVue.js
アプリ。
error: Mixed spaces and tabs (no-mixed-spaces-and-tabs) at src/components/Landing.vue:388:2:
どうすれば抑制できるのでしょうか。
これは ESLintエラー(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
}
}
1行のみのエラーを無視するには、その行にインラインコメント( eslint-disable-line no-mixed-spaces-and-tabs
または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コメントでコードを囲みます。
⋅⋅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!
これらのコードスタイルの問題を修正します。
ESLint ルール違反です。コードが実際に実行されるかどうかには影響しませんが、ソースコードが理想的にフォーマットされていないことを警告します。
これは、コードで インデント (非表示の文字)、タブとスペースの組み合わせを使用していることを意味します。
どちらか一方でなければなりません。したがって、常にどちらかのタブまたはスペースを使用し、両方を使用しないようにしてください。
ほとんどのIDEには、タブをスペースに、またはその逆に変換するオプションがあり、このルールに準拠するように既存のコードを変換します。
それ以外の場合は @ tony19の回答 で対応できます。