在设备上调试 Ionic 3 代码

Question

我正在测试 Ionic 3，到目前为止一切正常。我想在 ionic 实验室调试 TS 代码，所以我在 package.json 中添加了下一个配置：

"config": {
    "ionic_source_map": "source-map"
}

在此之后，我能够看到代码并对其进行调试（在 chrome devTools 中），但是当我在手机上执行相同的测试时，我无法看到 .Ts 文件并对其进行调试。任何人都知道哪种配置或如何使它们在手机上也可见？

Answer 1

我也遇到过这个问题，但是解决方法很简单：） 运行命令：

ionic cordova emulate android -l --debug

• -l 启动服务器以实时重新加载 www 文件

  --debug 标记为调试版本

因此，当使用chrome://inspect 检查设备/虚拟设备时，您可以像在 Web 应用程序中一样调试 typescript 文件、设置断点等。

调试：

• 在 Chrome 中，转到 URL 栏中的 chrome://inspect。
• 在您设备上应用的 WebView 中单击检查。

Answer 2

您可以使用Chrome Inspector 从手机调试 Ionic 应用程序。

先决条件：

• 对于 Windows，请安装必要的 USB 驱动程序。
• 用于连接您的设备的 USB 数据线。
• Chrome for Android 已在您的设备上安装并运行。
• 在您的设备上启用了 USB 调试。

调试：

• 在 Chrome 中，转到 URL 栏中的 chrome://inspect。
• 在您设备上应用的 WebView 中单击检查。