How to Upgrade React Native to 0.59.10 for 64‑Bit Support

Upgrade Background

Google announced that from August 1, 2019 all apps on Google Play must support 64‑bit architecture. React Native added 64‑bit support starting with version 0.58, so projects using older versions need to upgrade. Upgrading brings a more stable framework and new features.

Benefits of Upgrading

Hot Reloading now supports function components.

React upgraded to 16.8.6, enabling hooks and other new APIs.

Built‑in TypeScript support; .ts and .tsx files work without additional configuration.

Version Choice

Upgrading to 0.59 causes less pain than 0.60 because 0.60 introduces a breaking change: AndroidX support, which requires extensive native code modifications. Therefore the target version is 0.59.10.

iOS Upgrade

iOS 8.x support is dropped; the minimum deployment target must be increased. The Podfile changes are:

-platform :ios, '8.0'
+platform :ios, '9.0'
-    pod 'GLog', :podspec => '../node_modules/react-native/third-party-podspecs/GLog.podspec'
+    pod 'glog', :podspec => '../node_modules/react-native/third-party-podspecs/glog.podspec'

The TextInput component hierarchy changed, and any custom native modules may need testing.

Android Upgrade

After upgrading RN, appcompat‑v7 resolves to version 28.0.0, which may conflict with existing dependencies. Force lower versions in build.gradle:

allprojects {
    configurations.all {
        resolutionStrategy {
            force "com.android.support:appcompat-v7:26.0.1"
            force "com.android.support:support-v4:26.0.1"
        }
    }
}

Native modules often depend on the specific RN version; consult each library’s migration guide.

React Upgrade

Using Babel plugins to transform old code

React 16 introduces the Fiber renderer, deprecating lifecycle methods componentWillMount, componentWillReceiveProps, and componentWillUpdate. Replace them with: componentDidMount for side‑effects. componentDidUpdate (or shouldComponentUpdate) for updates.

Move initialization logic to the constructor.

Add the following Babel plugins:

module.exports = {
  presets: ['module:metro-react-native-babel-preset'],
  plugins: [
    'react-rename-unsafe-lifecycle',
    ['@babel/plugin-proposal-decorators', { "legacy": true }]
  ]
};

Relevant package.json dependencies:

{
  "dependencies": {
    "@babel/core": "^7.4.5",
    "@babel/runtime": "^7.4.5",
    "react": "16.8.6",
    "react-native": "0.59.10",
    "babel-plugin-react-rename-unsafe-lifecycle": "^1.0.4",
    "metro-react-native-babel-preset": "^0.54.1"
  }
}

React Native (JS) Changes

Deprecated components

RN 0.60 removes several core components; they remain available in 0.59 but should be planned for migration. Removed components include ImageStore, ListView, MaskedViewIOS, Slider, SwipeableListView, ViewPagerAndroid, WebView, AlertIOS, AsyncStorage, and NetInfo.

Non‑public APIs now exposed

Previously undocumented APIs such as ColorPropType, EdgeInsetsPropType, PointPropType, and ViewPropTypes are now exported from the main package and can be imported directly.

Behavioral changes

FlatList no longer calls onEndReached on initial render. scrollTo does not accept negative y values.

WebView onMessage data is double‑encoded; adding useWebKit restores old behavior.

NativeModules are read‑only; modify a copy and replace the whole object.

UIManager command paths changed; use

UIManager.getViewManagerConfig('RCTWebView').Commands.goForward

instead of the old constant.

The overall upgrade process is smooth; most native build issues are resolved quickly, and JavaScript adjustments are guided by clear console warnings. After the app runs, basic functionality works, though thorough regression testing is required to catch edge‑case regressions.

References: [1] Google Play 64‑bit requirement: https://android-developers.googleblog.com/2019/01/get-your-apps-ready-for-64-bit.html [2] Official migration guide: https://reactjs.org/blog/2018/03/27/update-on-async-rendering.html [3] Discussion on derived state: https://reactjs.org/blog/2018/06/07/you-probably-dont-need-derived-state.html#what-about-memoization [4] List of removed RN components: https://github.com/facebook/react-native/issues/23313