Skip to main content

React Native 0.75.4 Upgrade Guide: Fixing Breaking Changes & Dependency Issues

· 7 min read
Michael
Mobile Developer
Last updated on August 26, 2025

upgrade guide for fixing breaking chnges

Note: This guide is based on React Native 0.75.4 and Expo SDK 51 (as of August 2025). Check reactnative.dev and docs.expo.dev for updates if using newer versions like React Native 0.76 or Expo SDK 52.

Upgrading your React Native app unlocks new features and keeps it compatible with iOS (Xcode 16+, iOS 18 SDK) and Android (SDK 35), but breaking changes can make it tricky. This beginner-friendly guide walks you through upgrading to React Native 0.75.4 with Expo SDK 51, fixing dependency conflicts, and testing thoroughly. We’ll use tools like react-native-upgrade-helper and expo-codemod to streamline the process. No prior upgrade experience is needed, and we’ll explain key terms. For up-to-date templates, explore Instamobile or Dopebase.

By the end, your app will run smoothly on the latest version, ready for production. Let’s dive in!

Prerequisites​

Ensure you have these tools and setups:

  • Node.js (v20.x or later, LTS recommended): Download from nodejs.org.
  • npm (v10.x or later, included with Node.js).
  • EAS CLI: For Expo project management.
  • Android Studio (2024.3.2 or later): With Android SDK 35 and NDK r25+.
  • Xcode (16+): For iOS builds, with iOS 18 SDK (macOS only).
  • A code editor like VS Code.
  • Git: For version control.
  • A React Native project (preferably Expo SDK 50 or earlier).
  • macOS: Required for iOS builds.

What are breaking changes? Breaking changes are updates in React Native or its dependencies that require code or configuration changes to work, like renamed or removed functions.

Ready? Let’s prepare for the upgrade!

Step 1: Prepare Your Project​

Back up and assess your project to avoid issues during the upgrade.

  1. Commit your code to Git:

    git add .
    git commit -m "Pre-upgrade backup"
    git push origin main

  2. Check your current versions in package.json:

    {
      "dependencies": {
        "react-native": "^0.74.5",
        "expo": "~50.0.0"
      }
    }

  3. Review upgrade notes for React Native 0.75 at docs.expo.dev. Key changes include:

    • React updated to 18.3.1.
    • New architecture improvements (optional).
    • Deprecated APIs removed (e.g., UIManager methods).

  4. Install react-native-upgrade-helper:

    npm install -g react-native-upgrade-helper

    Compare versions:

    rn-diff 0.74.5 0.75.4

Summary:

  • Backed up project and reviewed upgrade notes.
  • Used react-native-upgrade-helper to identify changes.

Mega Bundle Sale is ON! Get ALL of our React Native codebases at 90% OFF discount 🔥

Get the Mega Bundle

Step 2: Upgrade React Native and Expo​

Upgrade to React Native 0.75.4 and Expo SDK 51 with automated tools.

  1. Install EAS CLI:

    npm install -g eas-cli

  2. Update package.json:

    {
      "dependencies": {
        "react": "18.3.1",
        "react-native": "0.75.4",
        "expo": "~51.0.0"
      }
    }

  3. Install dependencies:

    npm install

  4. Apply codemods:

    npx [email protected] sdk51 .

    What are codemods? Codemods are scripts that automatically update code to match new APIs or remove deprecated ones, saving manual effort.

  5. Use app.config.js for flexibility:

    export default () => ({
      name: "MyApp",
      slug: "myapp",
      version: "1.0.0",
      orientation: "portrait",
      icon: ".https://docs.instamobile.io/assets/icon.png",
      splash: {
        image: ".https://docs.instamobile.io/assets/splash.png",
        resizeMode: "contain",
        backgroundColor: "#ffffff"
      },
      ios: {
        bundleIdentifier: "com.myapp.app",
        buildNumber: "1.0.0"
      },
      android: {
        package: "com.myapp.app",
        versionCode: 1
      },
      updates: {
        enabled: true,
        url: "https://u.expo.dev/your-project-id",
        checkAutomatically: "ON_LOAD",
        fallbackToCacheTimeout: 0
      }
    });

  6. Test locally:

    npx expo start

Summary:

  • Upgraded to React Native 0.75.4 and Expo SDK 51.
  • Applied codemods and tested the app.

Step 3: Resolve Dependency Conflicts​

Fix dependency conflicts to ensure compatibility.

  1. Check for conflicts:

    npm list --depth=0

    Look for mismatched versions (e.g., multiple React versions).

  2. Update incompatible dependencies:

  3. Use resolutions if needed:

    {
      "resolutions": {
        "react": "18.3.1"
      }
    }

    Run npm install.

  4. Test again:

    npx expo start

Summary:

  • Resolved dependency conflicts using npm list and resolutions.
  • Verified app functionality.

Step 4: Update Platform Configurations​

Update iOS and Android settings to match new requirements.

  1. iOS:

    • Open ios/MyApp.xcworkspace in Xcode 16+.
    • Set deployment target to iOS 18 in Build Settings.
    • Update Podfile: 
      require_relative '../node_modules/react-native/scripts/react_native_pods'
      require_relative '../node_modules/@react-native-community/cli-platform-ios/native_modules'

      platform :ios, '18.0'
      use_react_native!(
        :path => '../node_modules/react-native',
        :hermes_enabled => true
      )
    • Run: 
      cd ios && pod install

  2. Android:

    • Update android/build.gradle: 
      buildscript {
        ext {
          buildToolsVersion = "35.0.0"
          minSdkVersion = 21
          compileSdkVersion = 35
          targetSdkVersion = 35
        }
      }
    • Update android/app/build.gradle: 
      android {
        compileSdkVersion 35
        defaultConfig {
          applicationId "com.myapp.app"
          minSdkVersion 21
          targetSdkVersion 35
          versionCode 1
          versionName "1.0.0"
        }
      }

  3. Test builds:

    npx expo run:ios
    npx expo run:android

Summary:

  • Updated iOS and Android configurations.
  • Tested platform builds.

Step 5: Test Thoroughly​

Ensure your app works post-upgrade with automated and manual tests.

  1. Install testing dependencies:

    npm install --save-dev jest @types/jest ts-jest @testing-library/react-native @testing-library/jest-native

  2. Configure Jest in package.json:

    {
      "scripts": {
        "test": "jest"
      },
      "jest": {
        "preset": "react-native",
        "transform": {
          "^.+\\.tsx?$": "ts-jest"
        },
        "setupFilesAfterEnv": ["@testing-library/jest-native/extend-expect"]
      }
    }

  3. Create a test in src/__tests__/App.test.tsx:

    import { render } from '@testing-library/react-native';
    import App from '../App';

    test('renders welcome text', () => {
      const { getByText } = render(<App />);
      expect(getByText('Welcome to MyApp!')).toBeTruthy();
    });

  4. Run tests:

    npm test

  5. Manually test on devices/simulators to catch UI or platform issues.

Summary:

  • Set up automated tests with Jest.
  • Conducted manual testing on devices.

Step 6: Deploy with OTA Updates​

Use OTA updates to deploy fixes for any upgrade issues.

  1. Install expo-updates:

    npm install expo-updates

    Check the latest version for Expo SDK 51 at docs.expo.dev.

  2. Ensure app.config.js includes OTA settings (Step 2).

  3. Add update logic to src/App.tsx:

    import { useEffect } from 'react';
    import { View, Text } from 'react-native';
    import * as Updates from 'expo-updates';

    export default function App() {
      useEffect(() => {
        const checkForUpdates = async () => {
          try {
            const update = await Updates.checkForUpdateAsync();
            if (update.isAvailable) {
              await Updates.fetchUpdateAsync();
              await Updates.reloadAsync();
            }
          } catch (e) {
            console.error('Update check failed:', e);
          }
        };
        if (!__DEV__) {
          checkForUpdates();
        }
      }, []);

      return (
        <View style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}>
          <Text>Welcome to MyApp!</Text>
        </View>
      );
    }

  4. Configure EAS Update:

    eas update:configure

  5. Publish an OTA update:

    eas update --branch production

  6. Test the update with a preview build:

    eas build --profile preview --platform all

Summary:

  • Configured OTA updates with EAS.
  • Tested updates on a preview build.

Troubleshooting Tips​

  • Dependency Errors: Run npm list and use resolutions in package.json for conflicts.
  • Build Fails: Ensure Xcode 16+ and Android SDK 35. Clear caches (rm -rf ~/Library/Developer/Xcode/DerivedData or ./gradlew clean).
  • Codemod Issues: Apply rn-diff changes manually if needed.
  • OTA Issues: Verify EXPO_TOKEN and app.config.js’s updates.url. Run eas update:configure.
Looking for a custom mobile application?

Our team of expert mobile developers can help you build a custom mobile app that meets your specific needs.

Get in Touch

Conclusion​

You’ve upgraded your React Native app to version 0.75.4 with Expo SDK 51, navigating breaking changes with confidence. Using react-native-upgrade-helper, expo-codemod, and EAS Update, your app is production-ready. For pre-upgraded templates, check out Instamobile or Dopebase. Dive deeper with Expo’s documentation or join the community at reactnative.dev.

Additional Resources​