ファイル、クラッシュレポート、ログの管理

Visual Studio Code（VS Code）の拡張機能であるVega Studioは、デバイスファイル、クラッシュレポート、ログの包括的な管理を提供することにより、アプリのデバッグ機能を強化します。Vega Studioを使用すると、アプリの動作の監視、クラッシュの調査、システムログの分析を一元的に行うことができます。これらのデバッグ機能は、問題を特定し、開発中のアプリの動作を確認するのに役立ちます。

​

前提条件

開始する前に、次の手順を実行してください。

1. VS Codeでアプリプロジェクトを開きます。
2. USBまたはネットワーク経由でデバイスを接続します。
   • 手順については、Vega仮想デバイスまたはFire TV Stickでのアプリの実行を参照してください。
3. デバイスがVega Studioのデバイスリストに表示されます。
   • 基本機能と詳細設定オプションについては、Vega Studioのセットアップと使用方法を参照してください。

​

クラッシュレポートの管理

クラッシュレポートを管理するには、[エクスプローラー] サイドバーの [Device Files] ビューを使用します。このビューは、接続されたデバイスからのクラッシュレポートを自動的に検出して表示します。

​

クラッシュレポートを開いてシンボリケート

1. 一覧から該当する項目をクリックして、クラッシュレポートを開きます。
2. 右クリックして [Symbolicate ACR] を選択すると、クラッシュレポートが読みやすい形式に変換されます。
   • 詳細については、Vega Studioを使用してアプリのクラッシュをデバッグする方法を参照してください。

​

クラッシュレポートのフィルタリング

[Crash Reports] の横にあるファネルアイコンをクリックすると、[Filter Crash Reports] ユーザーインターフェイスが表示されます。 名前または正規表現を使用してフィルタリングできます。

​

自動クラッシュ検出の構成

Vega Studioは新しいクラッシュレポートを自動的に検出し、通知を表示します。この動作はカスタマイズできます。 通知を無効にしたり、フィルターを設定したりするには、Vega Studioの拡張機能設定（[Kepler] > [Features] > [Acr Notifications]）に移動します。

​

ライブログの表示

アクティブな開発中のリアルタイムデバッグには、ライブログストリーミングを使用してください。VS Codeステータスバーの [Show Logs] ボタンを使用することをお勧めします。

1. VS Codeでアプリを実行します。
2. ステータスバーの [Show Logs] をクリックします。

   

3. 使用するデバイス Vega仮想デバイスまたはFire TV Stickから選択します。 Fire TV Stickを使用する場合は、USB経由で接続します。複数のプロジェクトがある場合、プロンプトが表示された時に対象のプロジェクトを選択します。 アプリの実行中、ログは [App Logs] チャネルにストリーミングされます。アイドル状態のアプリの場合は、[出力] チャネルを確認してください。

   

4. ステータスバーの [Stop Logs] をクリックしてストリーミングを終了します。

   

​

ログストリーミング設定の構成

ログのファシリティ、形式、レベルなどのログストリーミングの動作は、Vega Studio拡張機能の設定で調整できます。変更を有効にするには、ログストリーミングを停止して再起動する必要があります。詳細な設定については、システムログの管理を参照してください。

​

デバイスログのコピー

ログをコピーして履歴データを分析したり、チームメンバーとログを共有したり、問題を調査したりできます。次のいずれかのオプションを使用してください。 オプション1：[Device Files] ビュー（推奨） [Device Files] ビューでデバイスを右クリックし、[Copy logs] を選択します。システムはログを<プロジェクトディレクトリ>/logs/<デバイス名>/<ログの種類>/var_log/に保存します。 オプション2：コマンドパレット

1. VS Codeのアクティビティバーで、Vega拡張機能のアイコンをクリックします。
2. [Devices] セクションに移動してデバイスを選択するか、コマンドパレットに「Vega Device Management: copy logs from device」と入力します。
3. コピーするログをリストから選択します。

   

4. [出力] チャネルで完了ステータスとファイルパスを確認します。

   

​

コンソールログの表示

React Nativeのデバッグにコンソールログを使用すると、console.log()のステートメントをリアルタイムで表示できます。これらのログは、VS Codeの [出力] ウィンドウの [React Native] チャネルに表示されます。

1. Shift + Cmd + P（Mac）またはShift + Ctrl + P（Linux）を押して、コマンドパレットを開きます。
2. 「Output: Show Output Channels…」と入力します。
3. [React Native] を選択すると、アプリのコンソールログが表示されます。

アプリを実行すると、console.logのすべてのステートメントがこのチャネルにリアルタイムで表示されます。

​

関連トピック

• Loggingctlを使用したシステムログの管理
• Vega Studioを使用してアプリのクラッシュをデバッグする方法
• アプリのKPIを測定
• UIレンダリングの問題の特定
• オーバードローの検出
• コンポーネントの再レンダリングに関する問題の調査

---