React Native升级至0.59.1后@react-native-community/netinfo报错：RNCNetInfo为null

Hey there, let's work through this annoying NativeModule null issue you're facing after upgrading React Native and switching to the community NetInfo library. I've dealt with similar problems before, so here are the most effective fixes to try:

1. Double-Check Native Linking Configuration #

React Native 0.59 introduced auto-linking, but sometimes manual links can get messed up, or auto-linking might not catch everything. Let's verify both iOS and Android setups:

iOS #

• Open your project in Xcode using the .xcworkspace file (never the .xcodeproj after running pod install).
• Check your Podfile to ensure it includes this line:

  pod 'RNCNetInfo', :path => '../node_modules/@react-native-community/netinfo'
  

  If it's missing, add it, run cd ios && pod install, and restart Xcode.
• Go to your target's Build Phases > Link Binary With Libraries—make sure libRNCNetInfo.a is listed. If not, click the + button, search for it, and add it.

Android #

• Open android/app/build.gradle and confirm this line exists in the dependencies block:

  implementation project(':react-native-community-netinfo')
  

• Check android/settings.gradle for these lines:

  include ':react-native-community-netinfo'
  project(':react-native-community-netinfo').projectDir = new File(rootProject.projectDir, '../node_modules/@react-native-community/netinfo/android')
  

• Open MainApplication.java and ensure you've imported the package and added it to your packages list:

  // Top imports
  import com.reactnativecommunity.netinfo.NetInfoPackage;
  
  // Inside getPackages() method
  @Override
  protected List<ReactPackage> getPackages() {
    return Arrays.<ReactPackage>asList(
        new MainReactPackage(),
        new NetInfoPackage() // Add this line if missing
    );
  }
  

2. Clear All Caches (Trust Me, This Fixes 50% of RN Issues) #

Cached files often cause weird inconsistencies after upgrades or library changes. Run these commands in order:

# Clear npm cache
npm cache clean --force

# Clear React Native cache
watchman watch-del-all
rm -rf node_modules
rm -rf package-lock.json

# Reinstall dependencies
npm install

# iOS cleanup
cd ios
rm -rf Pods
rm -rf Podfile.lock
pod install
cd ..

# Android cleanup
cd android
./gradlew clean
cd ..

After this, restart your Metro bundler and rebuild the app.

3. Verify Your Import Syntax #

Make sure you're using the correct import for the community NetInfo library, not the old deprecated one from React Native:

// Correct import for @react-native-community/netinfo
import NetInfo from '@react-native-community/netinfo';

// Wrong (remove this if you have it)
// import { NetInfo } from 'react-native';

4. Downgrade to a NetInfo Version Compatible with RN 0.59.1 #

NetInfo v5.x might have dropped support for older React Native versions like 0.59. Let's try a version that's confirmed to work:

# Uninstall current version
npm uninstall @react-native-community/netinfo

# Install v4.7.0 (tested compatible with RN 0.59)
npm install --save @react-native-community/netinfo@4.7.0

# Re-link and re-install pods
react-native link @react-native-community/netinfo
cd ios && pod install && cd ..

Give these steps a try one by one—start with checking the linking config, then clear caches, and if those don't work, downgrade the library. This should resolve the NativeModule null error.

内容的提问来源于stack exchange，提问作者himanshu