仮想端末でReact Nativeアプリを動かす準備

Android

React Native

PCでAndroidの仮想端末を立ち上げて、React Nativeアプリを動かすための準備です。

Android studioのAVDマネージャーを使うことで簡単に設定ができます。

以下Ubuntuで作業した際の手順のメモです。

概要

ドキュメント
AVDマネージャー
Pie API Level 28 imageを選択
アプリを動かしてみる

ドキュメント

https://facebook.github.io/react-native/docs/getting-started

上記ページの「Using a virtual device」のあたりを参考に進めれば問題ないです。

AVDマネージャー

Android studioにて「Configure」からAVDマネージャーを起動します。デフォルトで端末が用意されているようですが、新しく作成しておきましょう。

「create a new AVD」を選択して次へ進みます。

エラーが表示されている場合

私の場合はそうだったのですが画面に以下のエラーが表示されている場合が有ります。

/dev/kvm device: permission denied.

メッセージの内容通りですが、現在のユーザーに/dev/kvmへの権限がないため発生しています。権限を持つグループに所属させるなどして実行できるようにしましょう。

再起動するとまたエラーになる場合

再起動すると/dev/kvmの所属グループがrootに戻る現象があるようです。以下の手順を行うことで対応出来ます。 qemu-kvmをaptでインストールすると、/dev/kvmのグループがkvmになり再起動しても変わらなくなります。
その後ログインしているユーザーをkvmグループに所属させましょう。
再起動すればグループに所属している状態になっているので、正常に動作するようになります。

sudo apt install qemu-kvm
sudo gpasswd -a $USER kvm

Pie API Level 28 imageを選択

Pie API Level 28 image.を選択して進みます。最初はimageファイルがないのでダウンロードする必要が有ります。ダウンロード後は該当のものを選択して次へ進めるようになります。

その後は必要な設定を選んで名前をつけて完成です。再生ボタンを押せば稼働端末が立ち上がります。

アプリを動かしてみる

上記で作成した仮想端末を立ち上げておき、アプリのプロジェクトディレクトリへ移動して以下のコマンドを実行すれば、仮想端末でアプリが起動します。

react-native run-android

エラーが出るかも

私が最初にやったときは以下のようなエラーが出ました。

Unable to load script from assets index.android.bundle

これはindex.android.bundleが無いために発生している様子です。以下コマンドを実行することで、該当ファイルが作られ正常に動作するようになります。

mkdir android/app/src/main/assets
react-native bundle --platform android --dev false --entry-file index.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res