開発モードでcreate-react-appを実行しているときにエラーオーバーレイを無効にする方法はありますか?開発モードでエラーオーバーレイを無効にする
これは私が話しているのオーバーレイです:イムは、コンポーネントがクラッシュしたときにエラーメッセージを表示するために、私のアプリでエラー境界(React 16 Error Boundaries)を使用しているので、私はこれを聞いてるのよ
が、エラーオーバーレイがポップアップして自分のメッセージをカバーします。
開発モードでcreate-react-appを実行しているときにエラーオーバーレイを無効にする方法はありますか?開発モードでエラーオーバーレイを無効にする
これは私が話しているのオーバーレイです:イムは、コンポーネントがクラッシュしたときにエラーメッセージを表示するために、私のアプリでエラー境界(React 16 Error Boundaries)を使用しているので、私はこれを聞いてるのよ
が、エラーオーバーレイがポップアップして自分のメッセージをカバーします。
我々が開発中のエラーオーバーレイを無効にするオプションを提供していません。 エラーバウンダリは使用されません(プロダクション用です)。
開発エラーのオーバーレイとエラー境界の両方が発生することはありません。エラーの境界線を表示する場合は、[escape]
を押すだけです。
エラーオーバーレイは、一般的なエラー境界(ソースコード、クリックして開くなど)を超える大きな価値を提供します。 ホットコンポーネントの再読み込みをすべてのユーザーの既定の動作として有効にすることも検討する必要があります。
オーバーレイを無効にすることを強く感じる場合は、react-scripts
から取り出してwebpackHotDevClient
の使用を中止する必要があります。あまり介入しない方法では、オーバーレイによってインストールされたerror
イベントリスナーをwindow
から削除することがあります。
私は同じ問題を抱えていましたが、私は長い間、create-react-appソースを掘り下げてきました。私はそれを無効にする方法はありませんが、それが効果的にエラーメッセージを停止する場所に置くリスナーを削除することができます。 developerConsoleを開き、htmlタグを選択します。そこではunhandledError.jsによって置かれたエラーとunhandlerejectionのイベントリスナーを削除することができます。画面の右上隅にあるxをクリックしてエラーメッセージを閉じることもできます。メッセージが表示されます。 config/webpack.config.dev.js
で
、entry
配列
require.resolve('react-dev-utils/webpackHotDevClient'),
で次の行をコメントアウトしてこれら二つのコメントを解除します
require.resolve('webpack-dev-server/client') + '?/',
require.resolve('webpack/hot/dev-server'),
本当に素晴らしいチップ!今私は、エラー境界をテストするために環境変数を操作する必要はありません。 – arvinsim