私が試したすべてのブラウザーで動作する React/redux でアプリを作成しましたが、MacOS の Safari と iPhone の任意のブラウザーで動作します。エラーもコンソールメッセージも表示されず、何のアイデアも得られません。Safariでのみタグをレンダリングし、画面は空白です。
この問題をどのように追跡できますか?
ありがとう
私が試したすべてのブラウザーで動作する React/redux でアプリを作成しましたが、MacOS の Safari と iPhone の任意のブラウザーで動作します。エラーもコンソールメッセージも表示されず、何のアイデアも得られません。Safariでのみタグをレンダリングし、画面は空白です。
この問題をどのように追跡できますか?
ありがとう
問題が見つかりました。失敗した主な理由は「フェッチ」機能でした...これは Safari では使用できません。何も出力しない理由はわかりませんが、try/catch 内で 'fetch' が呼び出されたためだと思われます。
あるデバイスで空白の画面が表示され、別のデバイスでは表示されない場合は、https://stackoverflow.com/a/61215326/470749を参照してください。
また、コードがfetch
どこかで使用していて、ブラウザがそれをサポートしていない場合にも、これが発生する可能性があります。
ブラウザーと OS のサポートを確認してください: https://caniuse.com/#search=fetch
fetch
例では APIを使用しています。これは、ネットワーク リクエストを作成するための新しい API でありXMLHttpRequest
、最も一般的なニーズに置き換わるものです。ほとんどのブラウザはまだネイティブにサポートしていないため、cross-fetch
ライブラリを使用することをお勧めします:// Do this in every file where you use `fetch` import fetch from 'cross-fetch'
内部的には
whatwg-fetch
、クライアントとサーバーでポリフィルを使用node-fetch
するため、アプリをユニバーサルに変更しても API 呼び出しを変更する必要はありません。
fetch
ポリフィルは、Promise ポリフィルが既に存在することを前提としていることに注意してください。Promise ポリフィルがあることを確認する最も簡単な方法は、他のコードを実行する前に、エントリ ポイントで Babel の ES6 ポリフィルを有効にすることです。// Do this once before any other code in your app import 'babel-polyfill'
問題は私にとってもフェッチでした。Webpack を使用しているので、この記事に従って正しくインポートするために追加します: http://mts.io/2015/04/08/webpack-shims-polyfills/
私は同じ問題を抱えていました.andのバージョンを更新する必要がantd
あり@ant-design/charts
、うまく機能したことに気付きました.