离子赝势文件

Below is a brief overview on how to get started troubleshooting bugs in your Ionic projects.

以下是有关如何开始对Ionic项目中的错误进行故障排除的简要概述。

介绍 (Introduction)

There are two main types of bugs that occur when developing in Ionic:

在Ionic中进行开发时，会发生两种主要类型的错误：

网络错误 (Web bugs)

The first type are bugs that can be reproduced in the browser and are not related to the native functionality of the app. These web technology bugs can be troubleshot just like any other bug in web development: in your browser using the browser’s DevTools. This is one huge advantage of hybrid mobile development.

第一种错误是可以在浏览器中重现的错误，与应用程序的本机功能无关。 这些Web技术错误可能会像Web开发中的任何其他错误一样被解决：在浏览器中使用浏览器的DevTools。 这是混合移动开发的巨大优势。

本机错误 (Native bugs)

The other type of bug are bugs that only appear on Android and or iOS devices. This article will document the steps to set up the developer tools so you can begin to fix them.

另一类错误是仅出现在Android和/或iOS设备上的错误。 本文将记录设置开发人员工具的步骤，以便您可以开始对其进行修复。

注意构建失败 (Note on build failures)

In order to keep the scope of this article bite-sized we will not address build and compilation errors in this article. A quick trick to try is ionic repair. This removes and recreates dependencies of your app.

为了保持本文的讨论范围，我们将不在本文中解决构建和编译错误。 一个快速尝试的技巧是离子修复。 这将删除并重新创建应用程序的依赖项。

$ ionic repair

调试您的Ionic应用程序的步骤 (Steps to debug your Ionic app)

步骤1：该错误在iOS和Android上是否可重现？ (Step 1: Is the bug reproducible on iOS and Android?)

If it’s on both iOS and Android, I prefer to fix the bug on Android first and confirm it is fixed in iOS after. This way I can use the Chrome developer tools to diagnose the bug. If it’s only on iOS, skip to step 4.

如果同时在iOS和Android上运行，则我更喜欢先在Android上修复该错误，然后再在iOS中确认该错误已修复。 这样，我可以使用Chrome开发人员工具来诊断错误。 如果仅在iOS上，请跳至步骤4。

第2步：如何在设备上使用Chrome远程开发工具。 (Step 2: How to get the Chrome remote dev tools working on your device.)

在Android设备上启用开发者模式： (Enable developer mode on your Android device:)

• Go to settings → about phone.
  转到设置→关于手机。
• Find the build number and press it 7 times. You will see a message counting down the last few times and then congratulating you on being a developer. (Thanks phone!)
  找到内部版本号，然后按7次。 您会看到一条消息，记录了过去几次，然后祝贺您成为开发人员。 (感谢电话！)
• Now go back to settings, then to system preferences.
  现在返回设置，然后返回系统偏好设置。

• On the system screen hit the Advanced Options drop down.

  在系统屏幕上，单击高级选项下拉菜单。

• Select Developer options.
  选择开发人员选项。
• Scroll down under the debugging heading and turn USB debugging on.
  在调试标题下向下滚动并打开USB调试。

• Now assuming your device is plugged into your computer, after a few seconds you will get a popup asking if you trust this machine. Hit the checkbox for allow always and then hit okay.

  现在假设您的设备已插入计算机，几秒钟后，将弹出一个询问您是否信任此计算机的弹出窗口。 选中始终允许复选框，然后单击确定。

• Now with your ionic app open on your device, open the Chrome dev tools on any site. Select remote tools as seen in the screenshot below.
  现在，在设备上打开离子应用程序后，在任何站点上打开Chrome开发工具。 选择远程工具，如下面的屏幕快照所示。

Then select your device from the list of remote tools.

然后从远程工具列表中选择您的设备。

第4步：现在，Chrome DevTools已打开 (Step 4: Now that Chrome DevTools is open)

You can view any console errors that have appeared. You can also refresh the app in the Chrome dev tools to load the app again and see things that you missed while the app loaded. You should now see an error message in your console and will be able to debug this error with Chrome dev tools.

您可以查看出现的任何控制台错误。 您还可以在Chrome开发者工具中刷新该应用，以再次加载该应用，并查看加载该应用时错过的内容。 现在，您应该在控制台中看到一条错误消息，并且能够使用Chrome开发者工具调试此错误。

步骤5：iOS调试 (Step 5: iOS debugging)

If the bug only occurs on iOS devices you need to enable developer tools in Safari on your mac and on your phone:

如果该错误仅发生在iOS设备上，则需要在Mac和手机上的Safari中启用开发者工具：

• Open Safari on your mac.
  在Mac上打开Safari。
• Go to the Safari menu and then preferences.
  转到Safari菜单，然后选择首选项。
• Go to the advanced settings under the gear icon.
  转到齿轮图标下的高级设置。
• At the bottom, check the box that states “show developer menu in menu bar”.
  在底部，选中指出“在菜单栏中显示开发人员菜单”的框。
• Now with the app open on your iOS device and with the device connected to your mac, click the Develop dropdown in Safari.
  现在，在iOS设备上打开应用程序并将设备连接到Mac的情况下，单击Safari中的Develop下拉菜单。
• Select your device from the Develop menu and then select local host.
  从“开发”菜单中选择您的设备，然后选择本地主机。
• The Safari developer tools should open up in a new window and you will be able to inspect and debug your app. You can also refresh the app to catch bugs that occur upon loading.
  Safari开发人员工具应在新窗口中打开，您将能够检查和调试应用程序。 您还可以刷新应用程序以捕获加载时发生的错误。

Bonus: having the Safari developer tools recognizing your device can be finicky. Try unplugging and re-plugging the device into the mac. If that doesn’t work, you can download Safari Technology Preview and repeat the steps above to enable the developer tools.

奖励：让Safari开发人员工具识别您的设备可能很棘手。 尝试拔下设备，然后将其重新插入Mac。 如果这不起作用，则可以下载Safari Technology Preview，然后重复上述步骤以启用开发人员工具。

翻译自: https://www.digitalocean.com/community/tutorials/ionic-troubleshooting-bugs

离子赝势文件