How to Upgrade React-Native version from 0.57.0 to 0.62.2 ๐Ÿš€

How to Upgrade React-Native version from 0.57.0 to 0.62.2 ๐Ÿš€

A guide for upgrading to latest version of React-Native 0.62.2

ยท

2 min read

This article will guide you through the process of upgrading your React native version from a lower version possibly less than 0.59 to 0.62

Tl;dr: it's a cumbersome process if you don't follow it correctly.

Why upgrade to newer versions of React Native? ๐Ÿ™„

Major reasons for upgrading to React Native v0.62.2

  • Speed boost! โœ”
  • Fast refresh / live-reload โšก
  • Hermes support (compiles the js code to binary, which helps in less startup time, faster response, and smaller app size)
  • First-class support for flipper (an awesome debugging tool for react-native)
  • Support for React hooks ๐Ÿ™Œ
  • Other Bug fixes. ๐Ÿž

Well, the newer versions of React native ( >0.60) has a utility tool to upgrade easily. It uses git under the hood to upgrade your React native under the hood. But coming to older versions of react-native (<0.60) this support doesn't work quite well. And in most cases, it requires you to manually upgrade.

So, to upgrade from 0.57.0 to 0.62.2 you need to first upgrade it to 0.58.6 and then 0.59.10 after this you're okay to upgrade to 0.62 or higher. This is my personal experience. Because jumping directly to the latest version had many confusions and thus failures. So, I recommend upgrading it in parts.

Here's the actual upgrade process of React native from 0.57.0 to 0.62.2

  1. Delete your node_modules folder
  2. Go to this page and select your current version and the target version (increase each version at a time)
  3. Click "Show me how to upgrade" button
  4. Now scroll down and manually check the changes shown in the diff.
  5. Try to replicate the same in your code
  6. Now install all the packages using yarn install or npm i
  7. Clean the project using gradlew clean
  8. Do a build either by yarn android or android studio.
  9. If the build is successful try to run the app in your device else there's a problem with the changed files, check diff again and repeat the steps 1 to 8.

That's it. You now have the latest React Native version. You've successfully upgraded from 0.57.0 to 0.62.2 ๐ŸŽ‰

Let me know if you face any problems or if you have any better ways to do it. ๐Ÿ˜Š

ย