フィールド ブラウザに有効なエイリアス構成が含まれていません

コードのコンパイル中にField ‘browser’ does not contain a valid alias configurationエラーが発生した場合は、これらのヒントとコツを確認して問題をトラブルシューティングしてください。Webpack と Webpack2 のどちらを使用しても、このエラーは両方で発生する可能性があります。また、一連のソリューションは Webpack の両方のバージョンで同じです。

フィールド ブラウザに有効なエイリアス構成が含まれていません

フィールド ブラウザーに有効なエイリアス構成エラーが含まれていないことを修正するには、次の手順に従います。

1. スペルミスをチェックする
2. インポート パスを確認する
3. エイリアスでエラーを見つける
4. 構文を確認する

これらの手順の詳細については、読み続けてください。

1]スペルミスをチェック

これは、Webpack でコードをコンパイルしているときに、フィールド ブラウザーに有効なエイリアス構成エラーが含まれていない場合に最初に確認する必要があることです。どの言語を使っていても、ちょっとしたスペルミスがあればうまくいきません。export default configを入力して変更を保存しようとしても、正しいコマンドを入力する必要があります。そうしないと、前述のようにエラーが発生します。

2]インポートパスを確認する

ほとんどの場合、ユーザーはインポート中にこのエラーに遭遇しました。インポート中は、正しいパスを入力することが唯一の要件です。また、正しいコマンドも使用する必要があります。それとは別に、パスの前に./を入力する必要があります。そうは言っても、次のようにインポート コマンドを入力すると、次のようになります。

import DoISuportIt from 'path'

うまくいきません。右側のコマンドは次のようになります。

import DoISuportIt from './path'

そうは言っても、この解決策は最初の解決策と同じくらい重要です。入力ミスがあると、無効なエイリアス構成エラーが確実に発生します。

3]エイリアスのエラーを見つける

Web アプリケーション全体を 1 つのファイルに記述することは実用的ではなく、ほぼ不可能です。そのため、人々はエイリアスを使用します。これに慣れていない場合は、エイリアスが相互リンクのように機能することを知っておく必要があります。エイリアスを使用する場合は、エイリアスが構成ファイルに既に存在することを確認する必要があります。たとえば、現在のスクリプトで JS モジュールを使用する場合は、JS モジュールが既にそこにあることを確認する必要があります。後で同じ名前で作成することを考えた場合、前述のエラーを取得せずに現在のコードをコンパイルすることはできません。

4]構文を確認する

場合によっては、正しい構文を使用することが非常に重要になります。そのため、コードで使用した、または使用する予定の構文を確認する必要があります。手紙の場合でも、上記のエラーが発生する可能性があります。とはいえ、ケースが首都にある場合は、スクリプト全体で同じものを使用する必要があり、その逆も同様です。

Webpackでモジュールが見つからないというエラーを修正するには?

Webpack でモジュールが見つからないというエラーを修正するには、モジュール パスを確認する必要があります。importコマンドを使用してモジュールをインポートすると表示されます。前述のように、タイプミスをチェックし、コマンドを細かく確認することを強くお勧めします。覚えておくべきことの 1 つは、インポート パスを使用するには./を使用する必要があることです。

Webpackの拡張エラーを修正するには?

正しいエイリアスなしでコードをコンパイルしようとすると、Webpack は no extension エラーを表示します。つまり、モジュール パスを確認し、入力ミスを確認する必要があります。最も重要なこととして、構文の大文字と小文字を確認し、エイリアスを確認する必要があります。

それで全部です！このガイドがお役に立てば幸いです。