React Native ImagePicker iOS端调用showImagePicker报错：无法读取undefined属性

Hey, I’ve run into this exact issue before—let’s work through it step by step. That error means your JS code can’t access the native ImagePicker module, which usually happens when the native setup has a hidden oversight even if you’ve done the basic steps. Here’s what to check:

• Double-check your Xcode project configuration

  • Make sure RNImagePicker.xcodeproj is properly added to the Libraries folder. Sometimes dragging and dropping can fail silently—right-click the Libraries folder, select Add Files to "[Your Project Name]", and navigate directly to node_modules/react-native-image-picker/ios/RNImagePicker.xcodeproj to re-add it.
  • Verify that RNImagePicker.a in Link Binary With Libraries is pulled directly from the Products folder of RNImagePicker.xcodeproj (not a random file). Also, ensure this is added for both Debug and Release build configurations.
  • Check your project’s Build Settings > Header Search Paths—add $(SRCROOT)/../node_modules/react-native-image-picker/ios and set it to recursive. Missing this path can prevent Xcode from finding the module’s header files, breaking the native-JS bridge.

• Clean all caches and rebuild from scratch

  • Run react-native clean in your project root, then delete the node_modules folder and reinstall dependencies with npm install or yarn install.
  • Close Xcode entirely, then delete your project’s Derived Data (you can find the path in Xcode > Preferences > Locations—just delete the entire folder).
  • Reopen Xcode, build the project first (Cmd+B) to confirm no compile errors, then run react-native run-ios.

• Verify import style and version compatibility

  • If you’re using a newer React Native version (0.60+), try switching to ES6 imports instead of CommonJS:

    import ImagePicker from 'react-native-image-picker';
    

  • Check that your react-native-image-picker version matches your RN version. For RN 0.60+, you need a version that supports auto-linking (v3.x and above). If you’re on an older RN version, install a compatible release:

    npm uninstall react-native-image-picker
    npm install react-native-image-picker@<compatible-version-number>
    

• Check your AppDelegate.m file (easy to miss!)

  • Open ios/[YourProjectName]/AppDelegate.m and add the import at the top:

    #import "RNImagePicker.h"
    

  • Then inside the didFinishLaunchingWithOptions method, add the initialization line:

    [RNImagePicker initPicker];
    

  Older versions of the module require this manual initialization to register the native module with React Native.

• Validate the module is loading correctly

  • Add console.log(ImagePicker) right after your import line and run the app. If it logs undefined, the native module isn’t registered at all. If it logs an object, double-check the method name—newer versions of react-native-image-picker replaced showImagePicker with launchImageLibrary, so you might need to update your call to match the module’s current API.

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