PhoneGap iOS アプリ開発でのデバッグ
こんにちは。
マイクロソフトの渡辺です。
PhoneGap を使っての iOS アプリ開発におけるデバッグについて、簡単に書き留めておきます。
Web サイトやサービスの制作/開発をする際にブラウザの開発者ツールを使うように、PhoneGap での iOS アプリ開発でも Sarafi の Web インスペクタを利用することができます。今回ご紹介するのは、iOS シミュレータと実機端末でのデバッグです ( 残念ながら 2014/8/31 現在、PhoneGap Developer App ではこの機能は使えないようです )。
iOS 側の Safari で Web インスペクタを ON にする
設定から Safari へと進みます。
詳細を選択。
すると、Web インスペクタの項目があるので、ONにします。
これで iOS 側の準備は完了です。
Safari の開発者メニューを表示
次に Safari 側の設定を行います。
Safari を起動して、メニューから環境設定を選択。
詳細タブにある、”メニューバーに"開発"メニューを表示”にチェックを入れます。
これで、Safari 側の準備も完了です。
Web インスペクタを確認
ここまでの設定を終えた上で、
phonegap run --device ios
や
phonegap run --emulator ios
で、アプリを実行してみましょう。
Safari の開発メニューを見ると、アプリが動作している iOS シミュレータまたは実機が表示されるので、選択してみます。
その後は、いつもの Web 開発での使い心地と同じです。要素を検証することもできますし、コンソールも同様に使えます。
iOS アプリの実機でバッグには、別途証明書の登録等が必要になりますが、既にお済みの方はぜひ、実機でも Web インスペクタを試してみてください。