Invariant Violation: requireNativeComponent: “AIRMap” was not found in the UIManager. No fix?

3
votes

I have followed the guide on the react-native-maps documentation : I got the error.

I looked everywhere on stackoverflow and on google and I was not able to find a fix.

I tried all answers I could find on forums and I still get the error.

The error :

Invariant Violation: requireNativeComponent: "AIRMap" was not found in the UIManager.

My code :

import React from 'react';
import MapView from 'react-native-maps';
import { StyleSheet } from 'react-native';

export default class App extends React.Component {
  constructor() {
    super();
    this.state = {};
  }

  render() {
    return (
      <MapView
         style = {styles.map}
         showsUserLocation = {false}
         followUserLocation = {false}
         zoomEnabled = {true}
      />
   )
  }
}

const styles = StyleSheet.create ({
  map: {
     height: 400,
     marginTop: 80
  }
})
5
react-native
Are you trying to run on iOS, Android or both? - stever
For the moment I only tried on iOS - jeanjohny
Sorry for the delay. How did you link 'react-native-maps'? If you used react-native link react-native-maps with npm, make sure you installed it with the --save tag. - stever
I used react-native link react-native-maps. But I used yarn, so I don't need to add --save right ? - jeanjohny
That's how it is supposed to work, but the docs only mention yarn in context of running the post install script. - stever

5 Answers

0
votes

Please check these two links which provide you detailed information about react native map integration in iOS & Android

Map integration link 1 for Android & ios

Map integration link 2

Some time iOS library does not link properly so you need to manually add library into Xcode.

0
votes

Try this:

open xcode project > your project > Build Phases > Link Binaries > Remove libAirMaps.a > then add it again > check if it works ... check image for detailed instruction

Edit : if you already installed react-native-maps try to add AirMapsLib manually. Follow the instructions on this image. after that, try again the above instruction. image instruction 1 here!

image instruction 2 here!

0
votes

I do not face this issue yet in iOS but on Android. Invariant Violation: requireNativeComponent:xxx not found in UIManager

Issue seems to be the dependent is not linked to your project, hence 2 solutions for this issue (depending on your 'dependency')

  1. run react-native link in terminal/cmd at your project path.
  2. Manual append the dependency in your MainApplication.java as shown below:

Manual append the dependency in your MainApplication.java as shown below:

@Override
    protected List<ReactPackage> getPackages() {      

      @SuppressWarnings("UnnecessaryLocalVariable")
      List<ReactPackage> packages = new PackageList(this).getPackages();
      // Packages that cannot be autolinked yet can be added manually here, for 
      packages.add(new RNFirebaseAnalyticsPackage());
      packages.add(new xxxPackage());
    }

There may be

0
votes

I have solved this issue by only running react-native run-android.
Note: if you have run react-native link unlink this first.

0
votes

Add below lines to MainApplication.java

import com.airbnb.android.react.maps.MapsPackage; 




        @Override
        protected List<ReactPackage> getPackages() {
          @SuppressWarnings("UnnecessaryLocalVariable")
          List<ReactPackage> packages = new PackageList(this).getPackages();
          packages.add(new MapsPackage());
          return packages;