Ionic 2：无法调试在 android 设备上运行的应用程序答案

【问题标题】：Ionic 2: Application running on the android device can't be debuggedIonic 2：无法调试在 android 设备上运行的应用程序
【发布时间】：2017-05-15 17:58:46
【问题描述】：

重现步骤： 1.创建新项目 https://github.com/driftyco/ionic-starter-super 2.运行`离子运行android` 3.使用chrome://inspect进行调试

没有 ts 并且调试不工作 - 见附件

这是我正在使用的：科尔多瓦 CLI：6.4.0 离子框架版本：2.0.0-rc.4 离子 CLI 版本：2.1.18 离子应用程序库版本：2.1.9 离子应用脚本版本：0.0.48 ios部署版本：1.9.0 ios-sim 版本：5.0.13 操作系统：macOS Sierra 节点版本：v6.9.2 Xcode 版本：Xcode 8.2.1 Build 版本 8C1002

【问题讨论】：

标签： cordova typescript ionic2

【解决方案1】：

我设法找出导致问题的原因以及解决方法。问题是，当您在 android 设备上进行远程调试时，Chrome 调试器无法访问设备上的源映射文件。解决方案/修复是包括内联源地图。为此，我：

将以下内容添加到项目根目录下的 package.json 中

"config": {
"ionic_bundler": "webpack",
"ionic_source_map_type": "#inline-source-map"
},

这是为了让 webpack 内联添加 source maps 更改了 tsconfig.js 行

"sourceMap": true,

到

"sourceMap": false

这是为了禁用 typescript 来创建源映射文件，因为这是由 webpack 完成的。

在此更改之后，一切似乎都正常

【讨论】：

自定义 ionic_source_map_type 可能会在产品构建期间导致问题。作为一种解决方法，您可以通过首先定义custom webpack config file 来将此配置限制为开发版本，然后使用useDefaultConfig.dev.devtool = '#inline-source-map' 调整配置（将此行插入链接的示例webpack.config.js）。