AirGoogleMaps dir must be added to your xCode project to support GoogleMaps on iOS. #4661

rgroothuis · 2023-04-05T08:19:09Z

rgroothuis
Apr 5, 2023

I've been reading all posts and suggestions. I've been trying for days to solve this problem without any luck, unfortunately. I'm really stuck and hope to get some help from this group.

I've followed all the instructions to install the react-native-maps for ios. I do get the Apple Maps on the simulator so big part of the installation was successful, at least that is my conclusion. When I add the provider={PROVIDER_GOOGLE} statement I get the following error message:

ERROR  react-native-maps: AirGoogleMaps dir must be added to your xCode project to support GoogleMaps on iOS. 
   at MapView (http://localhost:8081/index.bundle?platform=ios&dev=true&minify=false&modulesOnly=false&runModule=true&app=org.reactjs.native.example.PerfectPerformance:147564:78)
   at RCTView
   at View (http://localhost:8081/index.bundle?platform=ios&dev=true&minify=false&modulesOnly=false&runModule=true&app=org.reactjs.native.example.PerfectPerformance:45739:43)
.......

Of course I've added added to folder to my project, see screenshot:

Still I'm getting the error message and I don't know what to do. Who can help? Suggestions?

Again, I know there are similar posts on the forum about this error message, I've read them, tried to follow them but without any luck.

rgroothuis · 2023-04-07T14:29:43Z

rgroothuis
Apr 7, 2023
Author

This is driving me crazy and in the last week I'm not able to make any progress. Keep going around in circles. Who can help? All suggestions are welcome

Whatever I'm trying I keep getting this error:

LOG  Running "PerfectPerformance" with {"rootTag":11,"initialProps":{}}
ERROR  react-native-maps: AirGoogleMaps dir must be added to your xCode project to support GoogleMaps on iOS. 
   at MapView (http://localhost:8081/index.bundle?platform=ios&dev=true&minify=false&modulesOnly=false&runModule=true&app=org.reactjs.native.example.PerfectPerformance:147564:78)
   at RCTView
   at View (http://localhost:8081/index.bundle?platform=ios&dev=true&minify=false&modulesOnly=false&runModule=true&app=org.reactjs.native.example.PerfectPerformance:45739:43)
   at HomeScreen (http://localhost:8081/index.bundle?platform=ios&dev=true&minify=false&modulesOnly=false&runModule=true&app=org.reactjs.native.example.PerfectPerformance:147224:45)
   at StaticContainer (http://localhost:8081/index.bundle?platform=ios&dev=true&minify=false&modulesOnly=false&runModule=true&app=org.reactjs.native.example.PerfectPerformance:130686:17)
   at EnsureSingleNavigator (http://localhost:8081/index.bundle?platform=ios&dev=true&minify=false&modulesOnly=false&runModule=true&app=org.reactjs.native.example.PerfectPerformance:126955:24)
   at SceneView (http://localhost:8081/index.bundle?platform=ios&dev=true&minify=false&modulesOnly=false&runModule=true&app=org.reactjs.native.example.PerfectPerformance:130597:22)
   at RCTView
.......
.......

0 replies

rgroothuis · 2023-04-07T21:28:26Z

rgroothuis
Apr 7, 2023
Author

Started a new project and followed the steps listed at: https://codeburst.io/react-native-google-map-with-react-native-maps-572e3d3eee14 but running in exactly the same error message:

`

LOG Running "MapApp" with {"rootTag":41,"initialProps":{}}
ERROR react-native-maps: AirGoogleMaps dir must be added to your xCode project to support GoogleMaps on iOS.
at MapView (http://localhost:8081/index.bundle?platform=ios&dev=true&minify=false&modulesOnly=false&runModule=true&app=org.reactjs.native.example.MapApp:95663:78)
at App (http://localhost:8081/index.bundle?platform=ios&dev=true&minify=false&modulesOnly=false&runModule=true&app=org.reactjs.native.example.MapApp:95381:36)
at RCTView
at View (http://localhost:8081/index.bundle?platform=ios&dev=true&minify=false&modulesOnly=false&runModule=true&app=org.reactjs.native.example.MapApp:45750:43)
at RCTView
at View (http://localhost:8081/index.bundle?platform=ios&dev=true&minify=false&modulesOnly=false&runModule=true&app=org.reactjs.native.example.MapApp:45750:43)
at AppContainer (http://localhost:8081/index.bundle?platform=ios&dev=true&minify=false&modulesOnly=false&runModule=true&app=org.reactjs.native.example.MapApp:45631:36)
at MapApp(RootComponent) (http://localhost:8081/index.bundle?platform=ios&dev=true&minify=false&modulesOnly=false&runModule=true&app=org.reactjs.native.example.MapApp:83914:28)
ERROR Warning: Function components cannot be given refs. Attempts to access this ref will fail. Did you mean to use React.forwardRef()?

Check the render method of MapView.
in Unknown (created by MapView)
in MapView (created by App)
in App
in RCTView (created by View)
in View (created by AppContainer)
in RCTView (created by View)
in View (created by AppContainer)
in AppContainer
in MapApp(RootComponent)
ERROR react-native-maps: AirGoogleMaps dir must be added to your xCode project to support GoogleMaps on iOS.
at MapView (http://localhost:8081/index.bundle?platform=ios&dev=true&minify=false&modulesOnly=false&runModule=true&app=org.reactjs.native.example.MapApp:95663:78)
at App (http://localhost:8081/App.bundle?platform=ios&modulesOnly=true&app=org.reactjs.native.example.MapApp&dev=true&minify=false&runModule=true&shallow=true:23:36)
at RCTView
at View (http://localhost:8081/index.bundle?platform=ios&dev=true&minify=false&modulesOnly=false&runModule=true&app=org.reactjs.native.example.MapApp:45750:43)
at RCTView
at View (http://localhost:8081/index.bundle?platform=ios&dev=true&minify=false&modulesOnly=false&runModule=true&app=org.reactjs.native.example.MapApp:45750:43)
at AppContainer (http://localhost:8081/index.bundle?platform=ios&dev=true&minify=false&modulesOnly=false&runModule=true&app=org.reactjs.native.example.MapApp:45631:36)
at MapApp(RootComponent) (http://localhost:8081/index.bundle?platform=ios&dev=true&minify=false&modulesOnly=false&runModule=true&app=org.reactjs.native.example.MapApp:83914:28)
info Reloading app...
BUNDLE ./index.js

LOG Running "MapApp" with {"rootTag":51,"initialProps":{}}
ERROR react-native-maps: AirGoogleMaps dir must be added to your xCode project to support GoogleMaps on iOS.
at MapView (http://localhost:8081/index.bundle?platform=ios&dev=true&minify=false&modulesOnly=false&runModule=true&app=org.reactjs.native.example.MapApp:95663:78)
at App (http://localhost:8081/index.bundle?platform=ios&dev=true&minify=false&modulesOnly=false&runModule=true&app=org.reactjs.native.example.MapApp:95381:36)
at RCTView
at View (http://localhost:8081/index.bundle?platform=ios&dev=true&minify=false&modulesOnly=false&runModule=true&app=org.reactjs.native.example.MapApp:45750:43)
at RCTView
at View (http://localhost:8081/index.bundle?platform=ios&dev=true&minify=false&modulesOnly=false&runModule=true&app=org.reactjs.native.example.MapApp:45750:43)
at AppContainer (http://localhost:8081/index.bundle?platform=ios&dev=true&minify=false&modulesOnly=false&runModule=true&app=org.reactjs.native.example.MapApp:45631:36)
at MapApp(RootComponent) (http://localhost:8081/index.bundle?platform=ios&dev=true&minify=false&modulesOnly=false&runModule=true&app=org.reactjs.native.example.MapApp:83914:28)
ERROR Warning: Function components cannot be given refs. Attempts to access this ref will fail. Did you mean to use React.forwardRef()?

Check the render method of MapView.
in Unknown (created by MapView)
in MapView (created by App)
in App
in RCTView (created by View)
in View (created by AppContainer)
in RCTView (created by View)
in View (created by AppContainer)
in AppContainer
in MapApp(RootComponent)
`

My App.js file looks as follow:

import React, { Component } from 'react';
import { StyleSheet } from 'react-native';
import MapView, { Marker, PROVIDER_GOOGLE } from 'react-native-maps';
export default class App extends Component {
  render() {
    return (
      <MapView 
        style={{ ...StyleSheet.absoluteFillObject }}
        provider={PROVIDER_GOOGLE}        
      > 
        
      </MapView>
    );
  }
}

If I remove the provider tag within MapView then I get the Apple map, meaning that the initial part of react-native-maps is installed correctly.

Again, I hope somebody has found a solution for this problem.

2 replies

sarowerj May 22, 2025

thank you so much. It's working fine for me. Just removed the provider. // provider="google"
Thanks again ❤️❤️❤️

MuhammadAmann May 22, 2025

It worked for me also, Thanks

corasan · 2023-04-08T02:54:53Z

corasan
Apr 8, 2023

I am having the exact same issue! But in an expo workflow, weirdly enough I have another project (not using expo) running the same version of react-native-maps and it doesn't give me this error

3 replies

rgroothuis Apr 8, 2023
Author

Thanks for sharing your situation as well. I'm not an expert in all the different type of build environments, but which other project framework (not expo) are you using? Then I can try to setup that project framework as well.

And which guidelines have you followed to setup the Google maps environment?

corasan Apr 8, 2023

Just a bare react native project, setup the same way as in the instructions

rgroothuis Apr 8, 2023
Author

Yes, thanks. I assume the bare react native project is created by:

npx react-native init MapApp

this is according to https://reactnative.dev/docs/environment-setup. This is exactly what I did and I ran into the same problem, the same error message as well. There has to be another trick to solve this. But what is that trick?

skibaalex · 2023-04-24T17:25:13Z

skibaalex
Apr 24, 2023

Having the same problem with expo
@corasan @rgroothuis have you found any solutions?

4 replies

rgroothuis Apr 24, 2023
Author

No. Unfortunately not. I’m now using, for the time being, the Apple Maps. I hope in the future to switch to the Google maps.

corasan Apr 24, 2023

I did the same, using Apple Maps.

rgroothuis Apr 24, 2023
Author

That is acceptable, using Apple Maps if you only develop for iPhone devices, if you want to deploy on Android, Google Maps is required.

grantmac Oct 13, 2023

Any of you guys find a solution?

corasan · 2023-04-24T18:42:18Z

corasan
Apr 24, 2023

Should probably create an issue so maintainers are aware.

1 reply

rgroothuis Apr 24, 2023
Author

Done, see #4710 maybe others having the same problem can add more info to the issue itself. Thanks.

stjasink · 2023-04-28T07:47:58Z

stjasink
Apr 28, 2023

If you are following instructions that include copying the AirGoogleMaps folder, these are very old!

Try following the latest instructions from https://github.com/react-native-maps/react-native-maps/blob/master/docs/installation.md#ios which are thankfully much simpler.

I had similar issues before realising that I had been following very old instructions. There was a link to an old version in the main README in the react-native-maps repo, which is how I got there. I have submitted a PR to update it.

1 reply

rgroothuis Apr 28, 2023
Author

Thanks @stjasink for your feedback and suggestion. I've seen those instructions as well indeed. I'm working on another project right now, soon I will switch back to the Maps project and then I will try a brand new project and follow those instructions.
Most likely the problem is that at different locations different old and new instructions are listed, it was unclear (at least for me) which was the correct instruction list. And if one set if instructions is not working I will try to find others and even mix up the instructions :-).

Blurri · 2023-05-02T11:55:26Z

Blurri
May 2, 2023

How are you installing your pods? I had the same issue while i used npx pod-install to install the pods. After I used ruby bundle exec pod install to install the pods everything worked. It seems ruby is the recommended way to install the pods anyway.

1 reply

stjasink May 2, 2023

I just did this after updating the Podfile: cd ios and then pod install

francoangulo · 2023-05-31T02:06:50Z

francoangulo
May 31, 2023

Hello, if there is anyone still facing this issue, I was able to fix it following the first answer in this post:
https://stackoverflow.com/questions/53436368/react-native-maps-airgooglemaps-dir-must-be-added-to-your-xcode-project-to-supp

Basically go to xCode > Your Project > Build Settings > Preprocessor Macros > added HAVE_GOOGLE_MAPS=1 in the Debug option

1 reply

francoangulo May 31, 2023

@rgroothuis

simonandrew · 2023-06-21T16:35:09Z

simonandrew
Jun 21, 2023

Was anyone able to resolve this - I've tried all of the above but I'm still stuck with it. Any help appreciated!

UPDATE: Resolved (somewhat) by removing provider={PROVIDER_GOOGLE} - no google maps on iOS but this works fine for our use-case.

6 replies

stjasink Jun 22, 2023

PS I was using version 1.7.1 of react-native-maps and version 0.71.7 of react-native when I got it working.

simonandrew Jun 22, 2023

@stjasink thanks for your help - in the end we removed provider={PROVIDER_GOOGLE} and opted to use the default maps provider on iOS instead.

VaibhavDev111 Oct 6, 2023

Thanks a lot It worked for me :)

4sagar May 30, 2024

Thanks @stjasink . Your solution worked for me!

vuzzer Nov 16, 2024

Was anyone able to resolve this - I've tried all of the above but I'm still stuck with it. Any help appreciated!

UPDATE: Resolved (somewhat) by removing provider={PROVIDER_GOOGLE} - no google maps on iOS but this works fine for our use-case.

Thank you! I spent several hours debugging my code for iOS 😂😂. All I had to do was remove provider={PROVIDER_GOOGLE}, and everything works fine!

MarufZak · 2024-09-19T12:40:33Z

MarufZak
Sep 19, 2024

hi, this answer in stackoverflow worked for me:
https://stackoverflow.com/questions/53436368/react-native-maps-airgooglemaps-dir-must-be-added-to-your-xcode-project-to-supp

0 replies

salah-ghanim · 2024-10-15T17:11:40Z

salah-ghanim
Oct 15, 2024
Maintainer

I'm closing this discussion as well because if installation instructions are followed correctly, this shouldn't happen.

4 replies

Schitzos Oct 16, 2024

wait so i shouldnt need to copy and paste the airmaps from node modules to ios folder?

stjasink Oct 16, 2024

@Schitzos If you use a modern version of react-native-maps and follow the updated instructions, then you do not need to copy anything manually.

Schitzos Oct 16, 2024

is it because in Podfile
rn_maps_path = '../node_modules/react-native-maps' pod 'react-native-google-maps', :path => rn_maps_path

so it will refer to node_modules ?

Schitzos Oct 16, 2024

well it work well , since i follow the newest instruction, thank you @stjasink @salah-ghanim

dvynohradovv · 2024-12-27T12:04:14Z

dvynohradovv
Dec 27, 2024

Briefly:
For everybody, who still has the same issue. Do everything from the latest readme from the react-native-maps repo.
And finish build -> success -> install -> launch -> success circle.

When you run:
npx react-native start
It just starts the server and runs the latest build.

But in our case, you need to build your app again.
Using Xcode (build button) or npx react-native run-ios

What you should get:

info Building (using "xcodebuild -workspace {YOUR_PROJECT}.xcworkspace -configuration Debug -scheme {YOUR_PROJECT} -destination id={YOUR_ID}")
success Successfully built the app
info Installing
info Launching
success Successfully launched the app

Trouble:
You can see the opened simulator before the build finishes (or even fails), but there is no sense in opening it in that case.

0 replies

Uh oh!

AirGoogleMaps dir must be added to your xCode project to support GoogleMaps on iOS. #4661

Uh oh!

Replies: 12 comments · 23 replies

Uh oh!

rgroothuis Apr 7, 2023 Author

Uh oh!

rgroothuis Apr 7, 2023 Author

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

rgroothuis Apr 8, 2023 Author

Uh oh!

Uh oh!

rgroothuis Apr 8, 2023 Author

Uh oh!

Uh oh!

rgroothuis Apr 24, 2023 Author

Uh oh!

Uh oh!

rgroothuis Apr 24, 2023 Author

Uh oh!

Uh oh!

Uh oh!

rgroothuis Apr 24, 2023 Author

Uh oh!

Uh oh!

rgroothuis Apr 28, 2023 Author

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

salah-ghanim Oct 15, 2024 Maintainer

Uh oh!

Uh oh!

Replies: 12 comments 23 replies

rgroothuis
Apr 7, 2023
Author

rgroothuis
Apr 7, 2023
Author

rgroothuis Apr 8, 2023
Author

rgroothuis Apr 8, 2023
Author

rgroothuis Apr 24, 2023
Author

rgroothuis Apr 24, 2023
Author

rgroothuis Apr 24, 2023
Author

rgroothuis Apr 28, 2023
Author

salah-ghanim
Oct 15, 2024
Maintainer