Front/React Native

[ReactNative] Expo -> ReactNative Cli 전환 및 안드로이드 배포

프론트 인프라를 Expo -> ReactNative Cli로 교체하기로 했다..
빠르게 배포하려고 한 Expo가 한계점이 꽤 많았기 때문이다.
생산성은 높았지만, 마케터나 기획자가 요구하는 각종 정보를 제공하는데 기존엔 Api를 직접 만들어내 엇비슷하게나마 통계를 내고 했지만, 더 정확한 정보를 위해 여러 SDK를 붙이기로 했다.

(RestApi 소셜로그인 방식은 간편로그인을 할 수 없다는 치명적인 약점이 결정에 한몫했다.)

일단 어플 생태계 자체를 잘 모르다보니까 막 만들었어서, 이번엔 좀 제대로 구축하고 만들려했다.

그러기 위해선 Expo에서 자동으로 발급한 각종 인증과 키들을 cli환경에 맞게 바꾸는 일이 필요했는데, 레퍼런스도 부족하고 굉장히 고통을 겪었다.

특히 맥북에서 안드로이드 환경설정 진짜 맥북 중간에 10번은 부수고 싶었다.. 어휴..
백엔드가 너무 하고 싶다....


기존 expo프로젝트 폴더에서 안드로이드 키스토어를 뽑아내는 명령어 입력

expo fetch:android:keystore

 

그럼 터미널에

Keystore credentials

  Keystore password: ****
  Key alias:         ****
  Key password:      ****

요런 식으로 뜨면서
키파일.jks 라는 파일이 생긴다.

 

/android/gradle.propertes 파일 맨 밑에 다음을 추가한다.

MYAPP_UPLOAD_STORE_FILE=***.jks
MYAPP_UPLOAD_KEY_ALIAS=***
MYAPP_UPLOAD_STORE_PASSWORD=***
MYAPP_UPLOAD_KEY_PASSWORD=***

 

android/app/build.gradle을 변경해준다.
android/build.gradle가 아니다. app폴더 안에 있는 build.gradle다.

android/app/build.gradle - signingConfigs에 release를 추가해준다.

    signingConfigs {
        release {
            if (project.hasProperty('MYAPP_UPLOAD_STORE_FILE')) {
                storeFile file(MYAPP_UPLOAD_STORE_FILE)
                storePassword MYAPP_UPLOAD_STORE_PASSWORD
                keyAlias MYAPP_UPLOAD_KEY_ALIAS
                keyPassword MYAPP_UPLOAD_KEY_PASSWORD
            }
        }
        debug {
            storeFile file('debug.keystore')
            storePassword 'android'
            keyAlias 'androiddebugkey'
            keyPassword 'android'
        }
    }


buildType에도 release를 추가해준다.

    buildTypes {
        debug {
            signingConfig signingConfigs.debug
            if (nativeArchitectures) {
                ndk {
                    abiFilters nativeArchitectures.split(',')
                }
            }
        }
        release {
            // Caution! In production, you need to generate your own keystore file.
            // see https://reactnative.dev/docs/signed-apk-android.
            signingConfig signingConfigs.release
            minifyEnabled enableProguardInReleaseBuilds
            proguardFiles getDefaultProguardFile("proguard-android.txt"), "proguard-rules.pro"
        }
    }

 

이렇게 했을 때 오류가 있었는데
project.ext.react = [ entryFile: "index.js", ]
변경해주니까 잘 작동했다.
index.tsx로 타입스크립트 파일로 되어있던걸 js로 변경했다.

번들 파일은
cd android/
./gradlew bundleRelease 하고나면

app/build/outputs/bundle/release 에 번들 파일(aab) 생성된다.
생성된 번들 파일을 구글 플레이 스토어에 등록하면 안드로이드는 전환 끝..