Ionic framework 如何调试Ionic WebApp？

我想在WebStorm中调试我的ionic应用程序。 我可以在浏览器中运行应用程序。但是我如何调试呢

我试过：

ionic-service--debug

哪个似乎不会触发任何调试

当应用程序在浏览器中运行时，如何调试它？

根据需要，有几种不同的方法可以做到这一点。既然您已经尝试过爱奥尼亚发球，您是否可以尝试下面列出的其中一种

 ionic run
 ionic emulate

run或emulate命令将应用程序部署到指定的平台设备/模拟器。还可以通过添加--livereload选项在指定的平台设备上运行实时重新加载。live reload功能类似于ionic serve，但编译后的混合应用程序本身并没有使用标准浏览器开发和调试应用程序，而是监视其文件的任何更改，并在需要时重新加载应用程序。这就减少了为小的更改而不断重建应用程序的需求

---

希望这个能让你走！让我知道它是如何为您工作的。

浏览器是我为ionic进行大部分调试的地方。您使用什么浏览器进行调试？我使用Chrome并打开DevTools。有一个“源”选项卡，您可以在其中浏览应用程序代码以查找断点。例如，您可以在代码中为单击事件的控制器设置断点，然后逐步执行代码。然后，您可以使用控制台执行命令，以测试值和检查对象等。您是否无法执行此操作？或者，不熟悉的开发工具？如果不熟悉，则有可用的资源。如果不工作，断点是否未被命中？

我发现非常有用，您可以连接设备并在Cordova应用程序（适用于iOS和Android平台）上获得实时检查器。

有几种方法可以调试您的ionic应用程序

• 在浏览器中，您可以在控制台中捕获错误
• 如果你在模拟器或移动设备上模拟你的应用，你可以安装cardova插件，在xcode控制台中显示js错误。因此，您可以模拟您的设备并捕获xcode上的错误

以下是如何添加插件：

---

cordova插件添加

使用Chrome，您可以键入chrome://inspect进入您的地址栏 运行Android应用程序后，您可以在使用“爱奥尼亚运行Android”或“爱奥尼亚模拟Android”命令运行应用程序时检查应用程序

---

然而，Android的版本必须高于4.3，我认为…

另一种选择是使用ionicLab。它为我提供了以下步骤：在测试之前安装并准备所有项目依赖项。然后，单击

平台

菜单下的

测试

中的

服务

选项。执行项目后，单击预览栏的箭头图标

---

因此，Ionic将在加载的项目中抛出一个Chrome窗口，因此，您可以使用常用的开发人员工具。您应该查看在项目中使用的javascript文件，以便进行调试。

只需运行：

ionic serve-l

并从浏览器开发人员选项进行检查。

支持Android 4.4或更高版本的安卓应用程序也可以使用Chrome进行远程调试-