Vue がスペースエラーを報告した場合の対処方法

vue space エラーの解決策: 1. ビルド ディレクトリで webpack.base.conf.js ファイルを見つけ、そのファイル内のルールの登録を解除します。 2. 「npm run dev」を再実行します。 3. テストを開きます。ディレクトリ内の .eslintrc.js ファイルにカスタム ルールを追加します。 4. ルールを開き、「no-mixed-spaces-and-tabs」を手動で追加し、それを 0 として定義し、ルールを閉じます。

#このチュートリアルの動作環境: Windows 10 システム、Vue バージョン 3、Dell G3 コンピューター。

vue がスペース エラーを報告した場合はどうすればよいですか?

vue Space Error

vue プロジェクトをビルドしたところ、パス設定時にさまざまなエラーが次々と発生しました。最も一般的なものはいくつかの記述方法でしたたとえば、スペース、インデント、さまざまな括弧などです。その結果、文ごとに比較しました。修正には非常に時間がかかり、非効率でした。午前中はルーティング設定を 1 つも書きませんでした。

主なエラー レポートは次のとおりです:

一般的なエラー レポートのセクションをインターセプトし、そのうちの 1 つを選択しました:

Expected indentation of 4 spaces but found 1 tab

翻訳すると、次の意味になります: 4 つのスペースがインデントされることが予期されていましたが、 1 個のタブが見つかりました。これは、Vue が記述ルールを検出するときに、スペースのみを認識し、タブのインデントを認識しないことを意味します。このとき、ページのコンテンツを変更してタブをスペースに置き換える必要があり、さらに面倒です。解決策は次のとおりです:

まず、ビルド ディレクトリで webpack.base.conf.js ファイルを見つけて、ルールのこのセクションをログアウトします:

保存して、再度 npm を実行します。dev:

エラー レポートは消えますが、これを行うことの欠点は、すべてのエラー チェック機能が強制的に停止され、多くの文法エラーが検出できないことです。これはお勧めできませんし、コードの可読性と規則性にさらに悪影響を及ぼします。次に、別の方法を見つける必要があります。ルール内の設定を変更するだけです。

2 番目に、これは別の構成ファイルを使用します: テスト ディレクトリの .eslintrc.js ファイル (推奨)

カスタム ルールを追加し、全員が ESLint ルールに慣れることをお勧めします

ルール

一部のルールは構成ファイルで設定できます。

ルールには 3 つのエラー レベルがあります:

“off” 或者 0：关闭规则。
“warn” 或者 1：打开规则，并且作为一个警告（不影响exit code）。
“error” 或者 2：打开规则，并且作为一个错误（exit code将会是1）。

ルールをより深く理解できるように、ESLint はルールを分類します。

すべてのルールはデフォルトでは無効になっています。構成ファイルで、「extends」:「eslint:recommended」を使用して、推奨ルールを有効にし、いくつかの一般的な問題を報告します。これらの推奨ルールには、以下のタグが付けられています。

考えられるエラーをカスタム ルール設定と比較します

上記のエラーを例として取り上げます。これはスペース インデントに関連しており、関連するルール プロンプトを見つけます:

次に、 rules に移動し、「no-mixed-spaces-and-tabs」を手動で追加し、それを 0 として定義し、ルールを閉じます

// 在这里添加自定义规则
'rules': {
// allow paren-less arrow functions
'arrow-parens': 0,
// allow async-await
'generator-star-spacing': 0,
// 禁止空格和 tab 的混合缩进
'no-mixed-spaces-and-tabs'：0，
// allow debugger during development
'no-debugger': process.env.NODE_ENV === 'production' ? 2 : 0
}

OK、保存して更新すると、エラーが解消されていることがわかります。この利点は、無視する必要があるルールを選択することです。

推奨される学習: 「vue.j ビデオ チュートリアル 」

以上がVue がスペースエラーを報告した場合の対処方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。