作ったもの
Ionic reactでアプリを作成
ionicを使ったandroidアプリ開発に、Reactが使えると知ったので試してみた。
Reactでどのようにアプリを作っていくのかが知りたかったので、今回はサンプルをエミュレーターで動かすことを目標にした。
$ npm install -g @ionic/cli
$ ionic start myApp sidemenu --type=react
$ cd ./myApp/
$ ionic serve
以下のような画面が表示できれば成功
android stidio
次に、先ほど作ったアプリをandroidエミュレーターで動かすために準備をする。
ここからandroid studioをダウンロードする。
ダウンロードできたらユーザーガイドに従い、インストールを進める
まず、依存ライブラリをインストール
$ sudo apt-get install libc6:i386 libncurses5:i386 libstdc++6:i386 lib32z1 libbz2-1.0:i386
次に、先ほどダウンロードしたものを展開し、起動
$ sudo mv ~/Downloads/android-studio-ide-193.6626763-linux/android-studio/ /usr/local/
$ cd /usr/local/android-studio/bin
$ ./studio.sh
環境変数の設定
以下の環境変数を .bashrcに追記する。
$ export ANDROID_SDK_ROOT=$HOME/Android/sdk
$ export PATH=$PATH:$ANDROID_SDK_ROOT/tools/bin
$ export PATH=$PATH:$ANDROID_SDK_ROOT/build-tools
$ export PATH=$PATH:$ANDROID_SDK_ROOT/platform-tools
$ export PATH=$PATH:$ANDROID_SDK_ROOT/emulator
Android エミュレーターのセットアップ
エミュレーターを使うために、まずはKVMのインストール。
ターミナルに、以下のコマンドをうち、エミュレーターが使えるか確認（出力が0でなければ、エミュレーターを使うことができる）
$ egrep -c '(vmx|svm)' /proc/cpuinfo
エミュレーターを使えることが確認できたらkvmとついでに実機でデバックするためのadbをインストール。
$ sudo apt -y install qemu-kvm adb
$ sudo gpasswd -a "${USER}" kvm
設定を反映するため、再起動を行う。
$ sudo shutdown -r now
ionicアプリのビルド
$ cd myapp/
$ ionic build
android向けにビルド。
$ ionic cap add android
android studioでビルドしたプロジェクトを開く。
$ ionic cap open android