React Nativeアプリをビルドする手順(Android)

f:id:s-uotani-zetakansu:20171128150634j:plain

はまるところが多かったのでメモです。

Expo（CRNA)で作ったことを想定しています。

まずは、

create-react-native-app UpTest
cd UpTest

で適当に作ります。ただし、名前「UpTest」はのちのちパッケージ名になるので、複雑な名前にしておかないと、リリース時にコンフリクトしてリリースできなくなるので注意です！

＜ライブラリ追加したり、ソースを書いたりしてアプリを作りこんでいく＞

(Tips)

native-baseをつかうときは、

npm i -S @expo/vector-icons

を忘れないように。

また、このとき、

  async componentWillMount() {
    await Expo.Font.loadAsync({
      'Roboto': require('native-base/Fonts/Roboto.ttf'),
      'Roboto_medium': require('native-base/Fonts/Roboto_medium.ttf'),
    });
  }

も忘れないようにする

Expo　XDEで作ると、package.jsonの"react-native": "0.52.0",を"react-native": "https://github.com/expo/react-native/archive/sdk-25.0.0.tar.gz"に変更しろと言われる。

一時的に変えてもいいけど、ejectするまえに戻しておかないと、import com.facebook.react.ReactApplication; が見つかりませんエラーがでるっぽいです。

んで、次に

npm run eject

すると、androidフォルダとかが作られます。

Ejected successfully!が表示されたら成功です。エラーが出てても大丈夫(多分）

次に、

android/app/build.gradleのminSdkVersionを19に、android/app/src/main/AndroidManifest.xmlのandroid:minSdkVersionを19に上げておきます。

これをしておかないと、鍵をRSAで作っても（後述）対応していないようです。

あと、android/にlocal.propertiesという名前のファイルを作って、中身を以下のようにします。

sdk.dir=C:/Users/○○/AppData/Local/Android/Sdk

ここは自身のSDKの場所を書いてください

このタイミングで、アプリのアイコンなどをandroid/app/src/main/resに入れておきましょう

次に証明書の鍵を作ります。

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

いよいよビルドです

cd android
gradlew assembleRelease

(注)なぜかgradlew assembleReleaseは２回実行しないと上手くビルドされませんでした。

(注)ライセンスがどうのこうの言われたら、SDKのパスまで移動して、./tools/bin/sdkmanager.bat --licensesを実行してみてください

成功すると、andorid/app/build/outputs/apkフォルダが作られ、apkファイルが中にいます。

鍵を使って署名します

my-release-key.keystoreというのがプロジェクトファイルに作られていると思うので、それをandroidフォルダ内にコピーしておいてください。

そして、以下を実行します

jarsigner -verbose -keystore my-release-key.keystore app/build/outputs/apk/app-release-unsigned.apk my-key-alias

次に、署名されたapkファイルを圧縮？します

zipalign -f -v 4 app/build/outputs/apk/app-release-unsigned.apk my-app.apk

もしzipalignが無いといわれたら、SDKフォルダの中にあるビルドツールをPATHに追加します。以下のようなファイルです

C:\Users\○○\AppData\Local\Android\Sdk\build-tools\23.0.1

以上でビルド作業の終了です。

やること多すぎ＋エラー出すぎで開発の３倍ぐらいは時間かかりました。

おそらくこの通りにやっていてもどこかで引っかかると思いますが、どうにかして調べてください。

読者登録はこちらからお願いします。

webエンジニアの日常

RubyやPython, JSなど、IT関連の記事を書いています

React Nativeアプリをビルドする手順(Android)