Introduction
Web、iOS、Android、デスクトップ用のアプリケーションを構築する際、
コードを一元化できるのはとても魅力的です。Meteor はそれができる
ということなので色々試そうと思います。
Windows端末でAndroidの動作確認を行えるまで環境構築を行ってみます。
手持ちのMacbookが古過ぎるので…
Goal
Windows上でAndroid仮想デバイス(AVD)を用いたMeteorアプリケーションの動作確認環境を整える。
How to
環境情報
- Windows 10
- Java JDK 1.8.0_144
今回インストールするもの
- Meteor 1.6
- Android Studio 3.0
Meteor のインストール
https://install.meteor.com/windows からインストーラをダウンロードし実行します。インストールが完了するとコマンドプロンプトで meteor コマンドが使えるようになります。
他にもChocolatey (Windowsのパッケージマネージャ) を用いた方法がありますが、ここでは割愛します。詳しくはInstall Meteor.jsをご参照ください。
Android Studio for Windows のインストール
Android Studio と SDK ツールをダウンロードする | Android Studioからインストーラをダウンロードし実行します。
このとき「Chose Components」で Android Virtual Device をインストールに含めるようにします。
環境変数の設定
以下を追加します。
PATH
- %USERPROFILE%\AppData\Local\Android\Sdk\platform-tools
- C:\Program Files\Java\jdk1.x.x_xxx\bin (x: JDKのバージョン)
JAVA_HOME
- C:\Program Files\Java\jdk1.x.x_xxx (x: JDKのバージョン)
ANDROID_HOME
- %USERPROFILE%\AppData\Local\Android\Sdk
AVD (Android 仮想 デバイス) の作成
AVD ManagerはAndroid StudioのIDEの中からでないと遷移できない場所にあります。
空のプロジェクトを作成してからAVDの作成を行います。
- Android Studio を起動し「Configure」を選択します。
- Configure 画面で「SDK Manager」を選択します。
- 必要な Android OS のパッケージを選択してインストールします。
- 再度 Android Studio を起動し「Start a new Android Project」を選択し空のプロジェクトを作成します。
- ビルドされるまで待ちます。ビルド中にエラーが発生した場合はエラーメッセージ直下のリンクをクリックします。
- ビルドが完了すると
Tool→Android→AVD Managerがツールバーに表示されます。Create Virtual Deviceで新しいAVDを作成します。
Meteor アプリケーションの作成・実行
> meteor create myapp
> cd myapp
> meteor add-platform android
> meteor run android
meteor run android にて別のコンソールが立ち上がり AVD が起動されます。
このとき2種類のエラーで処理が停止しました。
Cannot read property ‘replace’ of undefined
作成した Meteor プロジェクトの中にある emulator.js を下記のように修正します。
/platforms/android/cordova/lib/emulator.js line 202:
var num = target.split('(API level ')[1].replace(')', '');
I replaced it with a regex search and extraction:
var num = target.match(/\d+/)[0];
[CB-12981] Error: Cannot read property ‘replace’ of undefined [Android]
This adb server's $ADB_VENDOR_KEYS is not set
AVD側のDeveloper Optionsの中にある Revoke USB debugging authorization を実行します。
Developer Optionsは以下の手順で有効化できます。
On Android 4.1 and lower, the Developer options screen is available by default. On Android 4.2 and higher, you must enable this screen as follows:
1. Open the Settings app.
2. (Only on Android 8.0 or higher) Select System.
3. Scroll to the bottom and select About phone.
4. Scroll to the bottom and tap Build number 7 times.
5. Return to the previous screen to find Developer options near the bottom.
usb - ADB Android Device Unauthorized - Stack Overflow
Configure On-Device Developer Options | Androrid Studio
Conclusion
MacOSでなければiOSアプリへのビルドができないので、
Windowsでやるのは賢明ではないですが、
ひとまずの環境を整えることはできました。
ちなみにDesktopアプリケーションは meteor-desktop パッケージを用いると作成できるようです。
Meteorの所感として日本語のドキュメントが少ないと感じました。1年前の記事を多かった印象です。プロダクトには不向きというご意見も。
学習し始めのため少なくとも一気通貫してみて、自身の目で見極めていきます。