APPROACH

Upgrading a React Native app in existing projects.(Recommended)

Upgrading a React Native app by creating a new project with the latest version.

Follow the steps below to do it correctly:

  • Copy your components folder to the new app.
  • Copy App.js and index.js from the old to the new one.(You can ignore this step and copy only related line changes)
  • Copy all assets (like images, icons, splashscreen).
  • Install all packages used in old package.json except react & react-native.

 

Debugging Steps for IOS

In latest react native Flipper component for debugging Android and IOS apps is provided out of the box.However in some cases in IOS, it gives build error if use_frameworks! is enabled.To fix this error you need to comment following lines in Podfile to disable Flipper after finishing react native upgrade steps

 

# use_native_modules!

 # Enables Flipper.

 #

 # Note that if you have use_frameworks! enabled, Flipper will not work and

 #  you should disable these next few lines.

 # add_flipper_pods!

 # post_install do |installer|

 #   flipper_post_install(installer)

 # end

In your App .xcodeproj/project.pbxproj is a very large file and its not possible(time consuming and difficult) to compare this file using rn-diff-purge. Best approach is to replace your current  .pbxproj file with the copy of latest .pbxproj file.After you do this and try to build App you will get errors like assets files(and missing fonts ) not found and third party package related error.To fix this you just need to compare current state of your .pbxproj file with your last state of .pbxproj in your App’s git repository(I use source tree  for git) and add those third party app lines manually by searching the missing file name from build error console.