在设备上调试 Ionic 3 代码

Question

我正在测试Ionic 3，到目前为止一切正常。我希望能够在ionic lab上调试TS代码，因此我在package.json中添加了以下配置：

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

之后，我能够在Chrome开发工具中看到代码并进行调试，但是当我在手机上执行相同的测试时，无法看到.Ts文件并进行调试。有人知道如何配置或使它们在手机上也可见吗？

- João Mourão

Answer 1

我也曾遇到过这个问题，但解决方案很简单 :) 运行命令：

ionic cordova emulate android -l --debug

• -l 启动服务器以实现自动重载www文件

  --debug 标记为调试版本

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

调试：

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

- Yerkon

Answer 2

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

先决条件：

• 对于Windows，安装必要的USB驱动程序。
• 一根USB电缆连接您的设备。
• 在您的设备上安装并运行Chrome for Android。
• 在您的设备上启用USB调试。

调试：

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

- Tomislav Stankovic

---

是的，我知道那个，但是在里面，你怎么比如说调试.TS代码？我知道了，但是我看不到.TS代码，只有经过转换后的一些.JS。这是唯一的方法吗？因为生成的文件可能有10万行，我想知道相机插件是否处理或被调试。 - João Mourão

请查看此链接：http://www.damirscorner.com/blog/posts/20161122-DebuggingIonic2AppsInChromeFromVisualStudioCode.html。 - Tomislav Stankovic