react-native-maps with expo

Summer 2020 Update:

The expo package no longer supports its own built-in MapView component. So, rather than importing MapView from expo (as @Leo mentioned) like so:

import { MapView } from 'expo';

You should directly install the react-native-maps module to import the MapView component from there, like so:

import MapView from 'react-native-maps';

You can download react-native-maps either by using the expo-cli command mentioned in the error message shown here or a package manager of your choice, like npm or yarn.

Usage

You can just import the MapView from expo as react-native-maps is included in expo. (There aren't any integration or linking steps if you use expo and haven't ejected your app. I guess the documentation is not very clear about this...)

Just import from expo like this:

import { MapView } from 'expo'

and than use it as usual and described in the documentation of react-native-maps:

<MapView
    initialRegion={{
      latitude: 37.78825,
      longitude: -122.4324,
      latitudeDelta: 0.0922,
      longitudeDelta: 0.0421,
    }}
  />

Integration of the Api key

The api keys from the google play console belongs into the android and ios section of your app.json if you use expo.

add this to your app.json > android.config:

"googleMaps": { "apiKey": "<android maps api key>" }

and this to your app.json > ios.config:

"googleMapsApiKey": "<ios maps api key>"

Your app.json should contain something like this in the end (and all of the other stuff which is usually in there):

{
    "expo": {
        "android": {
            "package": "com.company",
            "config": {
                "googleMaps": {
                    "apiKey": "<android maps key>"
                }
            }
        },
        "ios": {
            "bundleIdentifier": "com.company",
            "config": {
                "googleMapsApiKey": "<ios maps api key>"
            }
        }
    }
}