Atoms
Troubleshooting

ビルドとプレビューのトラブルシューティング

ビルドが失敗した場合やプレビューが読み込まれない場合は、最初に表示されているエラーから確認し、その症状に対応する復旧手順を進めてください。このページでは、App ビューアー、プレビュー、ビルドエラー、および問題を報告する前に実施すべき手順について説明します。

ビルドが失敗した場合やプレビューが読み込まれない場合は、最初に表示されているエラーから確認し、その症状に対応する復旧手順を進めてください。このページでは、App ビューアー、プレビュー、ビルドエラー、および問題を報告する前に実施すべき手順について説明します。

まずここから

エージェントがタスクを完了すると、App ビューアーにアプリが読み込まれます。ターミナルにはタスクのアクティビティとエラーが表示され、App ビューアーのツールバーには、App ビューアーを再読み込みするコントロール、デバイス表示の切り替え、新しいタブでプレビューを開くオプション、およびコンソールがあります。

  1. 最新の変更を保存し、現在のタスクまたはビルドが完了するまで待ちます。
  2. プレビューが古いままに見える場合や読み込み画面のままの場合は、Reload App Viewer を 1 回選択します。
  3. 埋め込みの App ビューアーが停止している、または応答しない場合は、新しいタブでプレビューを開きます。
  4. Console を開き、最初に表示されているエラーをコピーします。プロジェクトのリンクと障害が発生した時刻も控えておいてください。

ビルドが失敗した場合

まず Resolve を試す

Atoms がビルドの問題を検出すると、左下に 問題の報告 の通知が表示されます。通知に Resolve が含まれている場合は、別の操作を行う前に、まず 1 回修復を試してください。

  1. Resolve を選択し、現在の試行が完了するまで待ちます。
  2. 実行中に再度 Resolve を選択しないでください。
  3. 試行が完了しない場合は、表示されているステータスを記録し、以下の報告手順に進んでください。別の Resolve の試行は開始しないでください。
  4. 試行が完了したら、更新されたプレビューを確認します。更新されていない場合は、ブラウザを 1 回更新します。
  5. 問題の原因となった操作を繰り返します。問題が解消しない場合は、問題の報告 を展開し、以下の報告手順に進んでください。

ビルドエラーまたは依存関係の不足

プレビューパネルにビルドエラー、赤いエラーバナー、または不足しているパッケージに関するメッセージが表示される場合は、次の手順を絞り込むために、その正確なメッセージを使用してください。

  1. Console を開き、そこに表示されている完全なエラーメッセージをコピーします。
  2. Resolve が利用可能な場合は、1 回使用して試行が完了するまで待ちます。
  3. Resolve ボタンがない場合は、正確なエラーを Project chat に貼り付け、そのビルドエラーの修正をエージェントに依頼します。
  4. 特定の変更の後にエラーが発生し始めた場合は、History を開き、現在のバージョンを最後に正常に動作していたバージョンと比較します。
  5. エラーの切り分けが難しい場合は、最後の安定版から リミックス し、変更を段階的に再適用します。

App ビューアー、起動スクリプト、Publish、デプロイ記録、またはサードパーティ製パッケージの内部ファイルに言及するエラーは、プラットフォームの問題を示している可能性があります。Support に連絡する際は、完全なエラーメッセージを含めてください。

ビルドが進行中のままになる

再試行する前に、まずターミナルで現在のタスクのアクティビティを確認してください。タスクまたはビルドがまだ実行中の場合は、完了するまで待ちます。現在の試行が終了した後も進行中のままである場合は、ステータス、タイムスタンプ、プロジェクトのリンク、および表示されているエラーの詳細を記録してから、問題を報告してください。

プレビューまたは App ビューアーが読み込まれない場合

読み込み画面のまま、または応答しないプレビュー

まず、影響を受けているのが埋め込みの App ビューアーだけなのか、それともプレビュー URL や公開済みサイトにも影響しているのかを確認してください。

  1. 現在のタスクまたはビルドがまだ実行中かどうかを確認します。
  2. Reload App Viewer を 1 回選択します。
  3. 新しいブラウザタブでプレビューを開きます。
  4. 同じ URL をシークレットウィンドウでテストします。
  5. 最後に正常に動作していたバージョンが読み込まれる場合は、問題を引き起こした最近の変更と比較します。

製品に Cloud & AI の残高不足またはアプリの停止が明示的に表示されている場合は、Settings → Cloud & AI を開いてそのステータスを確認してください。画面が真っ白なだけで残高を追加しないでください。

空白または不完全なプレビュー

空白画面がアプリ全体に影響しているのか、それとも 1 つのページまたはコンポーネントだけに影響しているのかを確認してください。1 つの領域だけが影響を受けている場合は、ページセレクターを使ってそのページを直接開き、そこに到達する最小限のユーザージャーニーを再実行します。プレビュー全体が空白の場合は、ビルド結果に戻り、最初のビルドエラーまたはランタイムエラーを解決してから再度テストしてください。

Cookie、トークン、または秘密の値を共有せずに、Console または Network のエラーを記録してください。問題が続く場合は、サニタイズしたエラー詳細を報告に含めてください。

プレビューに古いバージョンが表示される

プレビューと公開済みサイトは別々のチャネルです。プレビューを更新する前に、最新の変更が保存され、最新のビルドが完了していることを確認してください。ビルド完了後にプレビューを開き直します。それでも古い内容が表示される場合は、History で現在のバージョンを最後に正常に動作していたバージョンと比較してください。

プレビューの表示がおかしい場合

操作やナビゲーションが機能しない

ページが表示されることと、そのページが正しく機能することは同じではありません。重要なナビゲーションリンクをすべて開き、主要なボタンを押し、重要なフォームを送信し、メインのユーザージャーニーを最初から最後までたどってください。1 つの操作が失敗した場合は、期待した結果が止まる正確な操作を記録し、修正のたびにその経路を再テストしてください。

モバイルレイアウトが崩れている

  1. App ビューアーのツールバーにあるデバイス切り替えを使って、モバイル表示に切り替えます。
  2. 利用可能な場合は、Design mode で崩れている要素を選択します。
  3. 期待するモバイルレイアウトと、変更してはいけない点を説明します。
  4. 1 つ変更を適用したら、デスクトップ表示とモバイル表示に加え、読み込み、空状態、ホバー、およびエラー状態を確認します。

画像やその他のアセットが見つからない

  1. Files セクションを開き、参照されているファイルが存在することを確認します。
  2. パス、ファイル名、および形式が、アプリで使用されている参照と一致していることを確認します。
  3. アセットが最近移動または名前変更された場合は、参照を復元するか、意図的に更新します。
  4. Reload App Viewer を選択し、影響を受けるページを再度テストします。

エージェントが間違った要素を変更した、または別の領域を壊した

  1. History を開き、最後の安定版から リミックス します。
  2. 利用可能な場合は、Design mode を使って正確な要素を対象にします。
  3. 変更してはいけない点を明示し、1 つのプロンプトにつき 1 つの変更だけを行います。
  4. 次の変更に進む前に結果を確認します。

問題を報告する

Resolve が利用できない場合、Resolve の試行が完了しても問題が残る場合、プレビューは応答しないが Project chat は引き続き使える場合、またはエージェントが調査した後も予期しない動作が続く場合は、問題を報告してください。

Project chat から Feedback を開く

  1. 影響を受けている Project chat を開き、関連する最新のエージェントメッセージを見つけます。
  2. ... (その他のオプション)を選択し、次に Feedback を選択します。
  3. サポートメッセンジャーで Send us a message を選択し、既存の会話がすでにある場合はその会話内で報告を送信します。

完全な問題の報告フローについては、問題の報告 を参照してください。

問題を再現できるだけの十分な詳細を含める

  • 問題の要約。 問題を 1 ~ 2 文で説明します。
  • Project または Chat Link。 問題が発生した URL を含めます。
  • 日付と時刻。 タイムゾーンも含めます。
  • 再現手順。 正確な操作を順番に列挙します。
  • 期待した結果と実際の結果。 本来どうなるべきだったか、代わりに何が起きたかを記載します。
  • すでに試したこと。 Resolve が表示されたか、完了後に何が起きたか、更新やリミックスで結果が変わったかを記載します。
  • ブラウザとデバイス。 ブラウザ、オペレーティングシステム、およびデバイスの種類を含めます。
  • 証拠。 スクリーンショットまたは録画、および関連する表示中の問題の報告または Console の詳細を添付します。

スクリーンショットやログを共有する前に、パスワード、API キー、認証トークン、Cookie、支払い情報、および無関係な個人情報や機密データを削除してください。

問題が修正された後

メインのユーザージャーニーを最初から最後まで実行してください。デスクトップ表示とモバイル表示の両方でプレビューを確認し、ページセレクターから各ページを開き、Console に赤いエラーメッセージがないことを確認します。アプリを公開する準備ができている場合は、プレースホルダーの内容を置き換え、App ビューアーで公開チェックを完了してください。

FAQ

なぜ App ビューアーに真っ白な画面が表示されるのですか?
  1. 問題が App ビューアーのみに影響しているのか、プレビュー URL にも影響しているのか、または公開済みサイトにも影響しているのかを確認します。
  2. Reload App Viewer を 1 回選択し、新しいタブでプレビューを開き、シークレットウィンドウでテストします。
  3. 現在のタスクまたはビルドがまだ実行中かどうかを確認します。再試行する前に完了するまで待ちます。
  4. Cloud & AI の残高不足またはアプリの停止が明示的なメッセージで表示されている場合は、Settings → Cloud & AI を開いてその残高を確認してください。画面が真っ白なだけで残高を追加しないでください。
  5. Cookie、トークン、または秘密の値を共有せずに、Console または Network のエラーを記録します。

画面が空白のままの場合は、Chat Link、完全な Viewer URL、時刻とタイムゾーン、影響を受ける環境、スクリーンショット、およびサニタイズしたエラー詳細を添えて Support に連絡してください。

このページは役に立ちましたか?

関連記事