rukurxの日記

自分の日々の作業や調べたことのメモ

React Native実行環境についてメモ

参考

facebook.github.io

furien.jp

React Nativeをアップグレードする

初めてReact Nativeのアップグレード作業をした時、たくさんコンフリクトしてかなり焦った。次回アップグレードをする時にどうすればいいかの手順を自分なりにまとめた。 公式ドキュメントはこちら。 facebook.github.io

インストール済のreact-nativeのバージョンを確認する

既にreact-native-git-upgradeを実行していると、package.jsonのバージョンと異なる場合があるので、念のためバージョンを確認する。
※ node_modules以下のreact-nativeのバージョンを表示してくれる。

$ react-native --version
react-native-cli: 2.0.1
react-native: 0.51.0

グレードアップするためのモジュールをインストールする

$ npm install -g react-native-git-upgrade

react-native-git-upgradeを実行する

  • バージョンを指定してアップグレードする
$ react-native-git-upgrade 0.52.0

バージョンを指定しないと最新版がインストールされる。 一気に最新バージョンまで上げると、コンフリクトが大量に発生した祭に手間取るので、個人的には0.1.0刻みくらいでアップグレードするほうが好み。

実行後、特に問題なければそのままコミットして、完了!

コンフリクトが発生したらひたすらコンフリクトを解決する。基本的には古いものを新しいものに置き換えていくことが多い。 途中で迷子になったらReact Nativeのバージョン間の差分を確認できる、rn-diffを見る。 github.com

flowのバージョンも上げる

React Nativeのアップグレードをすると毎回flowのバージョンアップもある。 自動でアップデートされないので、flowの場合は、.flowconfigのバージョンを確認して手動でアップデートする必要がある。

$ npm install --save-dev flow-bin@0.57.1
$ flow

flowコマンドを実行し、エラーがなくなるまで修正すれば完了。

まとめ

初めてアップグレードした時は最新のバージョンまで一気にやってしまい、マジどうなっているんだろうと思いながらの作業だった。 一度経験してから、手順を見直すとそこまで大変じゃない気がしてきます。 flow次第ではプログラムの修正数が凄いことになりますが... アップグレードする前に一度rn-diffを見ると、どんな変更があるか簡単に把握できるので、とりあえずrn-diffを見ておくことがオススメ。

はてなブログ始めました

去年からしばらくMediumで技術ブログを書いていましたが、半年ほどかかなくなり気分転換も兼ねてはてなで再開しようと思いました。 基本的には自分の技術メモ程度のものをまた続けていくことになりそう。 使い勝手がよかったらMediumからお引っ越ししようかな。