developmentseed / developmentseed/field-data-collection

Notes on getting react-native running with react-native-mapbox-gl

Open
#3 0 comments 0 reactions 0 assignees View on GitHub
Dominant language
Objective-C
Stars
0
Forks
2
PR merge metrics
No merged PRs in 30d

Description

Storing these notes here to refer back to, and I'll add android instructions later.

The important things I learned:

- latest react-native isn't supported by latest react-native-mapbox-gl, so we have to use an older version of react-native for now
- don't use cocoapods, because somehow it crunches the xcode project and the react-native cli tool's expectations of how things are set up
- make sure to close the simulator, clean the build, and delete & reinstall node_modules when things aren't working

# Installing react-native and react-native-mapbox-gl

## Initial set up

### Install react-native-cli

```
npm i -g react-native-cli
```

### Create the project using a specific version of react-native

```
react-native init Surveyor --version react-native@0.39.2
```

### Change directory into the project

```
cd Surveyor
```

### Install react-native-mapbox-gl

```
npm i --save react-native-mapbox-gl
```

## Android

### Follow the react-native getting started guide for android:

http://facebook.github.io/react-native/docs/getting-started.html

### Follow the react-native-mapbox-gl instructions for android:

Note: don't use `react-native link`.

https://github.com/mapbox/react-native-mapbox-gl/blob/master/android/install.md

When you add the `getPackages` method, make sure to add it to MainApplication.java, not MainActivity.java.

### Run the project in a simulator

Create and run a virtual device in android studio: https://developer.android.com/studio/run/managing-avds.html

```
react-native run-android
```

## iOS

### Follow the manual install instructions for iOS

https://github.com/mapbox/react-native-mapbox-gl/blob/master/ios/install.md

### Run the project in a simulator

```
react-native run-ios
```

## Android

### Follow the react-native getting started guide for android:

http://facebook.github.io/react-native/docs/getting-started.html

Contributor guide

No contributing guide indexed for this repository

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.