console.error: "react-native-maps" AirGoogleMaps dir must be added to your xCode project

Question

console.error: "react-native-maps" AirGoogleMaps dir must be added to your xCode project

I got this error when I am trying to test the example in react-native-maps module.

Github: https://github.com/airbnb/react-native-maps/tree/master/example

It is obvious that I should add the dir the to my Xcode project but I don't know how to add them.

May I have an example of adding dir to a Xcode project?

Answer 1

recently i had this issue, my problem solved with some changes on pod file.

source 'https://github.com/CocoaPods/Specs.git'
# Uncomment the next line to define a global platform for your project
platform :ios, '9.0'

target 'AppName' do
    pod 'Yoga', :path => '../node_modules/react-native/ReactCommon/yoga'
    pod 'React', :path => '../node_modules/react-native', :subspecs => [
    'Core',
    'RCTText',
    'RCTImage',
    'RCTAnimation',
    'RCTActionSheet',
    'RCTLinkingIOS',
    'RCTSettings',
    'RCTVibration',
    'RCTNetwork',
    'RCTWebSocket',
    'DevSupport',
    'BatchedBridge',
    'RCTGeolocation',
    ]

    pod 'GoogleMaps'  # Remove this line if you don't want to support GoogleMaps on iOS
    pod 'react-native-maps', path: '../node_modules/react-native-maps'
    pod 'react-native-google-maps', path: '../node_modules/react-native-maps'  # If you need GoogleMaps support on iOS

end

post_install do |installer|
    installer.pods_project.targets.each do |target|
        if target.name == 'react-native-google-maps'
            target.build_configurations.each do |config|
                config.build_settings['CLANG_ENABLE_MODULES'] = 'No'
            end
        end

        if target.name == "React"
            target.remove_from_project
        end
    end
end

also on your JS file you map tag must be something like this

<MapView
    provider={PROVIDER_GOOGLE}                   
    style={styles.map}
    // provider='google'
    // mapType='standard'
    ...
>

notice that your pod file must be linked correctly. don't need to add anything manually. you can remove your pod file and path with this commands

pod deintegrate

and

pod clean

and for install Cocoapods-Deintegrate Plugin and Cocoapods-Clean Plugin

Use this following command on your terminal to install it.

sudo gem install cocoapods-deintegrate

Cocoapods-Clean Plugin

Use this following command on your terminal to install it.

sudo gem install cocoapods-clean

hopefully this can help you.

Answer 2

I just removed following prop in MapView component and it worked!

provider={MapView.PROVIDER_GOOGLE}

Answer 3

I had this problem using react native 0.61, the solution on my case was: Stop the Metro Bundler, After that go to the pods directory:

cd ..
cd ios

Install again the pods:

pod install

Go to the project root:

cd ..

and run the project again npx react-native run-ios

This is the segment of my Podfile

  rn_maps_path = '../node_modules/react-native-maps'
  pod 'react-native-google-maps', :path => rn_maps_path
  pod 'GoogleMaps'
  pod 'Google-Maps-iOS-Utils'