개요
지금까지 개발한 RN(react native)를 안드로이드(Android)용으로 빌드하여 디바이스에 올리고 테스트하는 방법을 소개하겠습니다. 여기에서는 Mac(맥)에서 안드로이드(Android)용 서명 키(Signing Key)를 생성하고 빌드할 예정입니다. 이 블로그는 RN(react native)의 공식 사이트를 참고하였으며 상세한 설명은 공식 사이트를 참고하시기 바랍니다.
이 블로그는 연재물입니다. 아래에 내용을 함께 참고하시길 바랍니다.
안드로이드 서명 키 생성
Mac에서 터미널 프로그램을 열고 RN(react native) 프로젝트 폴더에 android/app 폴더로 이동합니다.
cd [your path]/android/app
아래에 명령어를 통해 안드로이드(Android)용 서명 키(Signing Key)를 발급합니다.
# keytool -genkey -v -keystore my-release-key.keystore -alias my-key-alias -keyalg RSA -keysize 2048 -validity 10000
keytool -genkey -v -keystore [key-name].keystore -alias [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]:
Enter key password for <my-key-alias>
(RETURN if same as keystore password):
전부 입력을 하고 나면 RN(react native) 프로젝트 폴더 하위에 android/app 폴더에 my-release-key.keystore 파일이 생성된 것을 확인할 수 있습니다.
서명 키 설정
서명 키(Signing Key)가 생성되면 gradle에 키를 설정해야합니다. android/gradle.properties 파일을 열고 아래에 코드를 추가합니다.
MYAPP_RELEASE_STORE_FILE=my-release-key.keystore
MYAPP_RELEASE_KEY_ALIAS=my-key-alias
MYAPP_RELEASE_STORE_PASSWORD=*****
MYAPP_RELEASE_KEY_PASSWORD=*****
아래에 코드를 android/app/build.gradle 파일에 추가합니다.
...
android {
...
defaultConfig { ... }
signingConfigs {
release {
if (project.hasProperty('MYAPP_RELEASE_STORE_FILE')) {
storeFile file(MYAPP_RELEASE_STORE_FILE)
storePassword MYAPP_RELEASE_STORE_PASSWORD
keyAlias MYAPP_RELEASE_KEY_ALIAS
keyPassword MYAPP_RELEASE_KEY_PASSWORD
}
}
}
buildTypes {
release {
...
signingConfig signingConfigs.release
}
}
}
...
빌드
RN(react native)가 있는 프로젝트 폴더에서 android 폴더로 이동한 후 아래에 명령어로 빌드합니다.
# cd android
./gradlew assembleRelease
빌드된 파일은 아래에 경로에 생성됩니다.
android/app/build/outputs/apk/release/app-release.apk
우리는 이 부분에서 아래와 같은 에러가 발생했습니다.
...
Execution failed for task ':app:lintVitalRelease'.
> Lint found fatal errors while assembling a release target.
...
좋은 방법은 아니지만, 우리는 android/app/build.gradle 파일에 아래에 내용을 추가하여 이 부분을 해결했습니다.
...
android {
...
lintOptions {
checkReleaseBuilds false
// Or, if you prefer, you can continue to check for errors in release builds,
// but continue the build even when errors are found:
abortOnError false
}
...
}
...
빌드된 파일 테스트
안드로이드 디바이스(Android Device)에 기존에 설치된 앱을 삭제하고 아래에 명령어를 실행하여 빌드 파일을 위한 테스트를 진행하세요.
react-native run-android --variant=release
에러 대응
공식 사이트에 내용을 통해 위와 같이 진행했지만 우리는 실제로 아래와 명령어를 통해 빌드 파일을 생성할 때와
./gradlew assembleRelease
아래에 명령어로 직접 디바이스에서 테스할 때,
react-native run-android --variant=release
아래와 같은 에러가 발생하였습니다.
java.lang.RuntimeException: Unable to load script from assets 'index.android.bundle'. Make sure your bundle is packaged correctly or you're running a packager server.
해결 방법으로 아래의 명령어를 먼저 입력하여 index.android.bundle을 생성한 후
react-native bundle --platform android --dev false --entry-file index.js --bundle-output android/app/src/main/assets/index.android.bundle
빌드를 하거나
./gradlew assembleRelease
직접 디바이스에 올려 테스트했습니다.
react-native run-android --variant=release
제 블로그가 도움이 되셨나요? 하단의 댓글을 달아주시면 저에게 큰 힘이 됩니다!
앱 홍보
Deku가 개발한 앱을 한번 사용해보세요.Deku가 개발한 앱은 Flutter로 개발되었습니다.관심있으신 분들은 앱을 다운로드하여 사용해 주시면 정말 감사하겠습니다.
![[심통]현장에서 바로 써먹는 리액트 with 타입스크립트 : 리액트와 스토리북으로 배우는 컴포넌트 주도 개발, 심통](https://img1c.coupangcdn.com/image/affiliate/banner/7cba8cb0601eebaf88a17a0c3cf65a63@2x.jpg)