'Invariant Violation: requireNativeComponent: "AIRMap" was not found in the UIManager. No fix?

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
  }
})


Solution 1:[1]

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.

Solution 2:[2]

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!

Solution 3:[3]

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

Solution 4:[4]

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

Solution 5:[5]

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;

Solution 6:[6]

Take advantage of yarn. As npm would give giving errors that has no relevance to the solve the problem.

Solution 7:[7]

you need to add google api key in your project as well to install the library properly.

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Vishal Dhanotiya
Solution 2
Solution 3 TommyLeong
Solution 4 Neo Anderson
Solution 5 Anupam Chaplot
Solution 6 Sunny Pepple
Solution 7 Ali Hassnain