androidreact-nativeexpoandroid-emulator

Naver Map does not appear in React Native in the Expo environment

First of all, please understand that my English is poor due to the use of a translator.

I have a question because I have a problem that I could not solve while studying the RN Expo environment.

I tried to add the Naver Map in the link below in the Expo environment, but it does not appear in my emulator.

https://github.com/mym0404/react-native-naver-map

As far as I know, if run npx expo prebuild after adding a plugin to app.json or app.config.js file, that dependency should be automatically added to Android, but it doesn't seem to be added to my code. Also, adding it manually doesn't solve the problem.

There is full code on github at the bottom. Please refer to this to resolve the issue.

Thank you

app.config.js plugins

plugins: [
      [
        "@mj-studio/react-native-naver-map",
        {
          client_id: process.env.NAVER_CLIENT_ID,
          android: {
            ACCESS_FINE_LOCATION: true,
            ACCESS_COARSE_LOCATION: true,
            ACCESS_BACKGROUND_LOCATION: true,
          },
        },
      ],
      "expo-router",
      [
        "expo-splash-screen",
        {
          image: "./assets/images/splash-icon.png",
          imageWidth: 200,
          resizeMode: "contain",
          backgroundColor: "#ffffff",
        },
      ],
      [
        "expo-location",
        {
          locationAlwaysAndWhenInUsePermission: "Allow $(PRODUCT_NAME) to use your location.",
        },
      ],
      [
        "expo-build-properties",
        {
          android: {
            extraMavenRepos: ["https://repository.map.naver.com/archive/maven"],
          },
        },
      ],
    ],

android/build.gradle

// Top-level build file where you can add configuration options common to all sub-projects/modules.

buildscript {
    ext {
        buildToolsVersion = findProperty('android.buildToolsVersion') ?: '35.0.0'
        minSdkVersion = Integer.parseInt(findProperty('android.minSdkVersion') ?: '24')
        compileSdkVersion = Integer.parseInt(findProperty('android.compileSdkVersion') ?: '35')
        targetSdkVersion = Integer.parseInt(findProperty('android.targetSdkVersion') ?: '34')
        kotlinVersion = findProperty('android.kotlinVersion') ?: '1.9.25'

        ndkVersion = "26.1.10909125"
    }
    repositories {
        google()
        mavenCentral()
    }
    dependencies {
        classpath('com.android.tools.build:gradle')
        classpath('com.facebook.react:react-native-gradle-plugin')
        classpath('org.jetbrains.kotlin:kotlin-gradle-plugin')
    }
}

apply plugin: "com.facebook.react.rootproject"

allprojects {
    repositories {
        maven {
            // All of React Native (JS, Obj-C sources, Android binaries) is installed from npm
            url(new File(['node', '--print', "require.resolve('react-native/package.json')"].execute(null, rootDir).text.trim(), '../android'))
        }
        maven {
            // Android JSC is installed from npm
            url(new File(['node', '--print', "require.resolve('jsc-android/package.json', { paths: [require.resolve('react-native/package.json')] })"].execute(null, rootDir).text.trim(), '../dist'))
        }

        google()
        mavenCentral()
        maven { url 'https://www.jitpack.io' }
    }
}

My Android Emulator screenshot

enter image description here

My RN Github

https://github.com/WhereToGo-Personal/FrontEnd-ReactNative

Solution

  • The react-native-maps library is currently facing some problems since the new Architecture was implemented as default in React.

    This library is being now heavily updated. You can follow the updates on this thread: Github react-native-maps thread.

    And this thread (Old Thread react-native-maps), was the initial one, which lost the track a bit, since there were too many requests/comments.

    You can though try to disable the new Architecture from your project for now. It might then work as expected.

    in the ---- app.json -----

    enter image description here