【React Native】react-navigationの導入 (expo)

React Nativeプロジェクトにreact-navigationを導入しようとしたら、手こずったので、備忘録として。 今回は、expoを使う場合なので注意。

react-navigationを導入するには、以下をインストールする必要があるが、それぞれのバージョンが対応していないと、動かない。

それぞれ以下のバージョンでインストールすれば動作することが確認できた。

"react-native-gesture-handler": "~1.3.0",
"react-native-reanimated": "~1.1.0",
"react-native-screens": "1.0.0-alpha.22",
"react-native-web": "~0.11.7",
"react-navigation": "^4.0.10",
"react-navigation-drawer": "^2.3.3",
"react-navigation-stack": "^1.10.3",
"react-navigation-tabs": "^2.6.2"

(package.jsonより)

それぞれは、npm install パッケージ名＠バージョン　でインストールできる。
もしくは、package.jsonを上記のように書き換えて、node_modulesとpackage-lock.jsonを削除して、npm install　で一括でインストール できる。

以上、対応バージョンで困ったので、参考までに

ちなみに、expo、reactなどのバージョンは以下(ここのバージョンはそんなに気にしなくてもいいかも、一応記載)

"expo": "~36.0.0",
"react": "~16.9.0",
"react-dom": "~16.9.0",
"react-native": "https://github.com/expo/react-native/archive/sdk-36.0.0.tar.gz",