react-native-webでReact-Navigationを使用すると、Web関連モジュールをインポートできないため、エラーが表示されます

Question

私は反応ナビゲーションで反応したネイティブWebを使用しています。

Module not found: Can't resolve './PlatformHelpers' in '/home/vineet/projects/jm-agent-web/node_modules/react-navigation/lib' 

これらのファイルが存在しているので、私はこのエラーを取得しています：PlatfomrHelpers.ios.js、PlatfomrHelpers.android.js、PlatfomrHelpers.web.js私はこのエラーを取得しています。しかし、PlatfomrHelpers.jsはありません。

私のES6インポートシステムは、react-native-webのインポート名 'PlatfomrHelpers'に対してPlatfomrHelpers.web.jsをインポートできません。

これを解決するにはどうすればよいですか？

Answer 1

私が実装したソリューションとその簡単なものを共有したいと思います。

問題は、webpackに.web.jsファイルのインポートを優先させるように指示することで解決できます。

私はwebpack.config.jsファイルに入った。トップレベルの 'resolve'プロパティの内側に '.web.js'を 'extensions'配列の要素として追加できます。次のコードは、それを解決：

extensions: ['.web.js', '.js', '.json', '.jsx'] 

は今私のWebPACKのは、文のための「PlatfomrHelpers.web.js」を拾っている：

import 'PlatformHelpers' 

Answer 2

問題はその反応-ナビゲーションのためPlatformHelpers.native.jsとPlatformHelpers.web.jsを区別していますネイティブとウェブ。反応ネイティブでは、通常あなたのプラットフォームを区別するために.ios.jsと.android.jsのファイルがあり、反応ナビゲーションもウェブをターゲットにしています。最も簡単な解決策は、ネイティブの場合は.native.js、ネイティブの場合は.web.jsのファイルも処理するようにフロー設定を教えることです。

したがって[options]セクションであなたの.flowconfigにこれを追加します。

module.file_ext=.web.js 

または標準のためには、ネイティブの反応：

module.file_ext=.native.js