2014年10月27日月曜日

Cordova/PhoneGap開発を加速するライブリロードを何とかする 〜 「PhoneGap Developer App」編

Cordova/PhoneGapでの開発は、HTMLやJavaScript、CSSなどの頻繁に変更されるファイルの編集がメインになる。

つまり、基本的にはこれらのファイルを変更するたびにコンパイルし直して端末・エミュレーターにインストールして…という非常に時間のかかる作業を繰り返すことになる。これでは極めて生産性が低い。

そこで、端末にインストールしたアプリのHTMLコンテンツの部分だけを変更のたびにライブリロードするという便利なネイティブアプリがあるので試してみる。(AndroidとiOS、WindowsPhone用)

PhoneGap Developer App

まず開発マシン上でWEBサーバーを起動し、

# phonegap serve
[phonegap] starting app server...
[phonegap] listening on 192.168.0.150:3000
[phonegap]
[phonegap] ctrl-c to stop the server
[phonegap]

アプリ側からサーバーに接続する。


ここでHTMLコンテンツの何かを変更すると、アプリが自動的にリロードしてくれるようになる。これでいちいちコンパイルとインストールを繰り返さなくて済むわけだ。

しかし、このシステムには大きなデメリットがある。それは、PhoneGapの標準プラグインは動作するものの、カスタムプラグインが動作しないことだ。

Livereload for Phonegap/Cordova/Ionic - Johannes Schickling

…PhoneGap Developer App doesn't support custom plugins yet…

しかし、このように書かれているので、将来的にはサポートされるかもしれない。

PhoneGap | PhoneGap Developer App


At the moment, we’re focusing on:

Windows Phone 8 support (already under development)
Custom plugin support support
Remote Web Inspector support
PhoneGap Build integration

この記事の後に1.3.0までバージョンアップしているが、まだサポートされていない。

PhoneGap | PhoneGap Blog

しかしながら、PhoneGap Developer AppにはiOSの開発者ライセンスを持っていなくても簡単にiOS上での開発ができるという大きなメリットもある。

ただ、実際の開発ではカスタムプラグインが使えないことは非常に問題なので、他の道を探ることにした。

琴線探査: Cordova/PhoneGap開発を加速するライブリロードを何とかする 〜 「LiveReload + GapReload plugin」編

追記14.11.26:ionicは簡単!
琴線探査: Cordova/PhoneGap開発を加速するライブリロードを何とかする 〜 「ionic」編