[React Native TIL] Expo에서 EAS로 android 빌드

CheckTodo 프로젝트를 완성하여 Google play 스토어에 앱을 배포하려고 한다. 그러기 위해서는 먼저 빌드를 진행해야하는데 해당 프로젝트를 처음 빌드하는 과정에서 여러 오류들을 막닥뜨려서 그 과정을 정리해 두었다. React Native를 활용하여 플랫폼을 제작하고 Android EAS로 빌드를 진행했다.

app.json 수정

빌드를 하기 위해서는 app.json을 수정해야 한다.

• name : name 프로퍼티는 사용자들이 보는 앱의 이름으로 서비스 이름으로 변경해야 한다.

• ios 프로퍼티

  • bundleIdentifier : 앱의 식별자로 다른 프로젝트와 중복되지 않도록 고유한 값을 작성해야 한다.
  • buildNumber : 버전이라고 할 수 있다.
  • infoPlist : 특정 권한이 필요할때 필요한 권한과 요청메시지를 작성해야 한다.
  • supportTablet : 테블릿 지원. false로 해주어 테블릿은 지원안하도록 한다.
  • infoPlist : 사진 접근 권한은 Permissions.MEDIA_LIBRARY의NSPhotoLibraryUsageDescription에 메시지를 입력하면 된다.

    infoPlist를 통해 권한을 요청할 때 주의할 점은 애플의 심사 통과를 위해 꼭 필요한 권한만 요청하고 필요한 이유를 메시지에 명확하게 포함해야 한다.

• 안드로이드 프로퍼티

  • package : 앱의 식별자로 다른 프로젝트와 중복되지 않도록 고유한 값을 작성해야 한다.
  • versionCode : 버전
  • permissions : ios에서 infoPlist와 같은 권한 설정.Permissions.MEDIA_LIBRARY의 READ_EXTERNAL_STORAGE와 WRITE_EXTERNAL_STORAGE를 설정해주면 된다.

app.json

{
    "expo": {
        "name": "CheckTodo",
        "slug": "my-first-expo",
        "version": "1.0.0",
        "orientation": "portrait",
        "icon": "./assets/icon.png",
        "userInterfaceStyle": "light",
        "splash": {
            "image": "./assets/splash.png",
            "resizeMode": "contain",
            "backgroundColor": "#5F2A78"
        },
        "assetBundlePatterns": ["**/*"],
        "ios": {
            "supportsTablet": false,
            "bundleIdentifier": "com.checktodo.gyduddl",
            "buildNumber": "1.0.0",
            "infoPlist": {
                "NSPhotoLibraryUsageDescription": "The app accesses to photo library 
              to upload your profile when you are signing up or updating profile."
            }
        },
        "android": {
            "package": "com.checktodo.gyduddl",
            "versionCode": 1,
            "permissions": ["READ_EXTERNAL_STORAGE", "WRITE_EXTERNAL_STORAGE"],
            "adaptiveIcon": {
                "foregroundImage": "./assets/icon.png",
                "backgroundColor": "#ffffff"
            }
        },
        "web": {
            "favicon": "./assets/favicon.png"
        }
    }
}

빌드

expo build 명렁어를 이용해서 뒤에 원하는 플랫폼을 입력하면 해당 플랫폼으로 빌드가 된다.

$ expo build:ios
$ expo build:android

💥 오류 발생

구글링 해보니 expo에서 eas로 마이그레이션 해야 한다고 한다.
https://docs.expo.dev/archive/classic-builds/migrating/

EAS 설치 및 배포 환경 준비하기

1. EAS 설치

$ npm install -g eas-cli

2. EAS 로그인(expo 아이디로 로그인 해주면 된다.)

$ eas login

3. eas.json파일을 생성

$ eas build:configure

4. 빌드 하기

$ eas build --platform ios //apple 로그인해야함
$ eas build --platform android

💥 오류 발생

ios 빌드를 하니 아래와 같은 오류가 발생했다.

Authentication with Apple Developer Portal failed!
Apple provided the following error info:
You are not registered as an Apple Developer.  
Please visit Apple Developer Registration. https://developer.apple.com/register/

번역해보니 apple 개발자 등록을 해야한다는 것이다. 즉, 약 13만원을 내고 개발자 등록을 해야한다는 것.....

andriod 빌드를 했는데 여기서도 오류가 발생했다.

Android build failed:
Gradle build failed with unknown error.
See logs for the "Run gradlew" (https://expo.dev/accounts/hyoyoungkim/projects/my-first-expo/builds/e446e3e9-41c0-4e4b-a824-ce03ef0b90db#run-gradlew) phase for more information.

구글링을 해본 결과,firebase.json을 gitignore에 추가하면 eas 빌드에서 깃을 확인할 때 firebase.json 파일을 확인할 수 없어서 발생하는 문제였다. 그래서 firebase.json 파일을 gitignore에서 제거하고 깃에 추가해서 다시 시도해보았더니!! 안드로이드에서 잘 빌드가 되었다.

참고 : https://www.inflearn.com/questions/840849/%EB%B0%B0%ED%8F%AC%EC%A4%91-%EC%97%90%EB%9F%AC-%ED%95%B4%EA%B2%B0%EC%9D%B4-%EC%95%88%EB%90%98%EB%84%A4%EC%9A%94-%E3%85%9C%E3%85%9C