React Native Upgrade From 0.59 to 0.60

Facebooktwittergoogle_plusredditpinterestlinkedinmail

Introduction

So, we need to upgrade the one of our projects from react native 0.59 to 0.60. In general such upgrade is more difficult than others (e.g. 0.59 => 0.60 oor 0.60 =>0.61) because of two majors changes:

  1. auto linking is introduced in 0.60
  2. android x is introduced in 0.60

Here are some brief steps and pitfalls that we met, hope this would help others. (While it\'s hard to follow successful path of others, but it\'s ironically easy to step into the pitfalls of predecessors.)

Main Flow of Upgrade:

  1. use react native grade helper to get the list of changesets
  2. MANUALLY update the source files based on the changesets generated
    • this seems not efficient, but it's ALREADY the best and easiest way to do so for now.
  3. run npm install to update the libaries
  4. (optional) there might be few warnings to remind u to unlink some libraries, run react native unlink xxx to unlink them (they would be linked by autolink)
  5. use npm install xxx@yyy to update some libraries
  6. go to ios, run pod install
  7. run react native start
  8. run react native run-ios
    • fix ios libraries
  9. run react native run-android
    • fix android x libraries, you need to refer to this csv file for library name mapping change
  10. start the app in device and test

Pitfalls:

  1. try to use latest npm and node.js
  2. the react native upgrade helper has one big tricky place! The changeset for android/app/build.gradle is super important, but it's collapsed by default, and it's super easy to miss this one!

  1. when auto link happen?
    • it won't happen during npm install
    • for iOS, it's done during pod install
    • for android, it's done during when gradle is triggered react-native run-android
  2. when I stuck, what should I do?
    • Despite all the instructions, there are 99% chance people will stuck at somewhere. Good news is, you could always google out something, and the bad news is, not every google result are correct or even relevant. If all Google results does not work out, try to debug yourself.

Debug Hints

In general here are the spots that you could put down some debug code:

  1. problem with pod install:
    • pod install is done by ruby
    • auto-link part actually triggered a ruby script of use_native_modules! (yes, the script file name literally contains the exclamation mark.)
    • for one time, the pod install runs extremely slow (like 5 minutes to finish), and it turns out it the script will try to run react-native info and this one is super slow. Eventually I checked out a cleaned source into a new folder, and it works.
  2. problem with react-native start / react-native run-android:
    • npm scripts will trigger gradle, which is mainly java based compilation script
    • check the build.gradle inside folders <project>/android and <project>/android/app

Leave a comment

Leave a Reply

Your email address will not be published.

*