web-dev-qa-db-ja.com

ionicエミュレータでconsole.logsを見る方法は?

Ionic framework を使用してアプリを構築しています。これは、これまでブラウザーで行ってきました。 cordovaOauth plugin を使用したいので、エミュレータを使用する必要があります。問題は、ブラウザで見ているようにエミュレータでconsole.log()を見ることができないため、デバッグが難しいことです。

Ionic/Cordovaでエミュレータのコンソールロギングを利用する方法を知っている人はいますか?すべてのヒントを歓迎します!

36
kramer65

エミュレータでコンソールログを有効にするだけです。ここに私の例:

> ionic emulate ios --livereload

  Setup Live Reload
  Running dev server: http://localhost:8100
  Adding in default Ionic hooks
  Running live reload server: http://localhost:35729
  Watching : [ 'www/**/*', '!www/lib/**/*' ]
  Ionic server commands, enter:
    restart or r to restart the client app from the root
    goto or g and a url to have the app navigate to the given url
    consolelogs or c to enable/disable console log output
    serverlogs or s to enable/disable server log output
    quit or q to shutdown the server and exit

コマンドラインにconsolelogsと入力し、Enterキーを押します。

  consolelogs

  Console log output: enabled
  Loading: /?restart=382451
  ionic $ 0     498458   log      Hi there! This is from console.log
49

実行ionic emulate ios -l -c

これにより、livereload機能でエミュレーターが開き、ターミナルにすべてのコンソールログが表示されます。コンソールをオフ(またはオン)にするには、ionicサーバーの実行中に端末でconsolelogsまたはcを書き込むだけです。

IOSエミュレータ/デバイスを使用しているときにアプリをデバッグする別の非常に便利な方法は、Safari開発者ツールを使用することです

アプリが実行されたら-Safariと入力して、[開発]> [iOSシミュレーター]> [ページ]を選択します

実際のデバイスを使用している場合、「iOS Simulator」の代わりにデバイスの名前が表示されます

サファリに「開発」メニューが表示されない場合-Safariの設定を入力し、「詳細」タブから有効にします

28
Yaron U.
  1. エミュレーター/シミュレーターの使用でコンソールログを見たくない場合

    ionic emulate -l -c <PLATFORM>

  2. デバイスでテストするときにコンソールログを表示したくない場合は、次のコマンドを起動できます。

    ionic run -l -c <PLATFORM>

-c = --consolelogs:アプリコンソールログをIonic CLI(livereload req。)に出力します。

-l = --livereload:デバイスからのライブリロードアプリ開発ファイル

誰かを助けるかもしれません!

19
S.Thiongane

Android 4.4以降を実行しているデバイスでWebアプリをテストしている場合、Chrome開発者ツールを使用してWebViewでWebページをリモートでデバッグできます。 USBデバッグモードの電話が接続されているデスクトップでchrome:// inspectを実行します。

7
Ruchir Shukla

ionicアプリをデバッグするにはいくつかの方法があります。

  • ブラウザでは、コンソールでエラーをキャッチできます。
  • シミュレーターまたはモバイルデバイスでアプリをエミュレートしている場合、xcodeコンソールにjsエラーを表示するcordovaプラグインをインストールできます。したがって、デバイスをエミュレートし、Xcodeでエラーをキャッチできます。

プラグインを追加する方法は次のとおりです。

cordova plugin add https://git-wip-us.Apache.org/repos/asf/cordova-plugin-console.git

お役に立てれば! GeoFireエラーをデバッグし、cordovaカメラと位置情報APIをテストしているときに、非常に役立ちました。

5
user15163

Ionic 3では、これを行うことができます

ionic cordova run Android --emulator -l -c

要件に応じて、Androidiosに置き換えます。詳細はこちら: https://ionicframework.com/docs/cli/cordova/run/

3
slider