[React Native] 빌드하기

2023. 8. 28. 20:37·React Native/공통
반응형

Expo가 아닌 React Native에서 빌드하는 방법을 작성하려고 한다. 

Window 환경에서 진행하며 iOS는 유감이지만 진행하지 않고 Android 만 진행할 계획이다. 

 

서명 키 생성 

빌드를 하기 위해서는 서명키가 필요하다고 한다. 

현재 개발 환경에서 android / app 폴더로 이동해서 명령어를 통해 서명키를 발급받는다. 

keytool -genkey -v -keystore my-upload-key.keystore -alias my-key-alias -keyalg RSA -keysize 2048 -validity 10000
Enter keystore password:
Re-enter new password:
What is your first and last name?
  [Unknown]:
What is the name of your organizational unit?
  [Unknown]:
What is the name of your organization?
  [Unknown]:
What is the name of your City or Locality?
  [Unknown]:
What is the name of your State or Province?
  [Unknown]:
What is the two-letter country code for this unit?
  [Unknown]:
Is CN=*****, OU=Unknown, O=Unknown, L=*****, ST=*****, C=***** correct?
  [no]:

서명 키 생성 명령어를 실행하면 아래와 같이 입력하라는 것이 나오는데 

순서대로 [ 이름 ] [ 소속 팀 ] [ 소속 ] [ 지역 ] [ 거주지의 주 / 도 ] [ 국가코드 ] 를 입력하면 된다. 

 

국가 코드는 한국의 경우 " KR " 을 입력하면 된다. 

 

이렇게하면 android / app 폴더에 [ my-upload-key.keystore ] 파일이 생성된다. 

 

서명 키 설정 

해당 서명키를 어플에 설정해주는 작업이 필요하다. 

MYAPP_UPLOAD_STORE_FILE=my-upload-key.keystore
MYAPP_UPLOAD_KEY_ALIAS=my-key-alias
MYAPP_UPLOAD_STORE_PASSWORD=*****
MYAPP_UPLOAD_KEY_PASSWORD=*****

android / gradle.properties 파일에 해당 코드를 추가해주면  된다. 

 

여기서 STORE_PASSWORD 와 KEY_PASSWORD라는 생소한 것이 나오는데 

keytool -genkey -v -keystore my-upload-key.keystore -alias my-key-alias -keyalg RSA -keysize 2048 -validity 10000

명령어를 그대로 사용하면 처음 입력한 비밀번호가 동일하게 STORE_PASSWORD 와 KEY_PASSWORD로 설정된다. 

만약 따로 설정하고 싶다면 " -keypass " 옵션을 통해서 각각 설정해줄 수 있다. 

 

그후 android / app / build.gradle 파일을 열어서 수정해준다. 

...
android {
    ...
    defaultConfig { ... }
    signingConfigs {
        release {
            storeFile file(MYAPP_UPLOAD_STORE_FILE)
            storePassword MYAPP_UPLOAD_STORE_PASSWORD
            keyAlias MYAPP_UPLOAD_KEY_ALIAS
            keyPassword MYAPP_UPLOAD_KEY_PASSWORD
        }
    }
    buildTypes {
        release {
            ...
            signingConfig signingConfigs.release
        }
    }
}
...

 

빌드 

설정이 완료되면 android 폴더로 들어가서 명령어를 실행시켜준다. 

cd android
./gradlew bundleRelease

 

명령어가 끝나면 android / app / build / outputs / bundle / release 경로에 release.aab 파일이 만들어진다. 

 

반응형
저작자표시 비영리 변경금지 (새창열림)

'React Native > 공통' 카테고리의 다른 글

iOS 실시간 위치 정보 가져오기 - 확장판  (1) 2024.12.21
react native flex:1 의 오류  (1) 2024.11.16
iOS 실시간 위치 정보 가지고 오기  (1) 2024.08.24
React Native 파이어베이스 배포하기  (1) 2024.08.10
[React Native] 첫 프로젝트  (2) 2022.07.17
'React Native/공통' 카테고리의 다른 글
  • react native flex:1 의 오류
  • iOS 실시간 위치 정보 가지고 오기
  • React Native 파이어베이스 배포하기
  • [React Native] 첫 프로젝트
잉여개발자
잉여개발자
풀스택 개발자를 목표로 잉여롭게 개발 공부도 하면서 다양한 취미 생활도 즐기고 있는 잉여 개발자입니다.
  • 잉여개발자
    잉여로운 개발일지
    잉여개발자
    • 분류 전체보기 (789)
      • 개발정보 (36)
      • 개발환경 (7)
      • 개발생활 (19)
      • React (141)
        • 이론 (23)
        • 기능 (12)
        • 실험실 (88)
        • 버그 (6)
        • 패스트캠퍼스 (9)
        • Npm (3)
      • React Native (28)
        • 공통 (6)
        • TypeScript (3)
        • JavaScript (18)
        • 버그 (1)
      • Next.js (30)
        • 이론 (13)
        • 실험실 (13)
        • 버그 (3)
      • Web (35)
      • 알고리즘 (202)
        • 풀이 힌트 (39)
      • JavaScript (47)
      • TypeScript (29)
        • 기초 (27)
        • 실험실 (2)
      • Node.js (13)
        • 이론 (0)
        • 기능 (3)
        • 실험실 (9)
        • 버그 (1)
      • 도커 (4)
      • CCNA (22)
        • 이론 (4)
        • 문제 (18)
      • 취미생활 (167)
        • 잉여로운 칵테일 (2)
        • 잉여의 식물키우기 (130)
        • 잉여로운 여행기 (11)
        • 잉여의 제2외국어 (21)
        • 잉여로운 책장 (2)
      • Java (1)
        • Java의 정석 (1)
      • 꿀팁 공유 (3)
  • 태그

    자바스크립트
    바질
    타일러영어
    바질 키우기
    리얼클래스
    식물
    webpack
    Docker
    ChatGPT
    영어회화
    CSS
    네이버 부스트캠프
    CCNA
    타입스크립트
    Babel
    Node.js
    네트워크
    덤프
    다이소
    프로그래머스
    영어독학
    redux
    next.js
    ReactNative
    typescript
    react
    리액트
    javascript
    알고리즘
    리얼학습일기
  • hELLO· Designed By정상우.v4.10.1
잉여개발자
[React Native] 빌드하기
상단으로

티스토리툴바