android - Android 设备上的 Ionic 2 中未显示 Typescript sourcemaps

Question

我遇到了一个奇怪的 Ionic2 行为。当我将我的应用程序部署到模拟器时，我可以在 chrome 检查调试器中看到 .ts 文件 sourceMap。

在这两种情况下，我都使用:

ionic run android

另一方面，当我在真实设备上部署我的 apk 时，“源”选项卡与其他目录组完全不同，并且没有引用我的 .ts 文件。

我的环境是:

• OS X 10.11
• ionic 2 2.0.0-beta.35
• Cordova 6.3.0

该项目最初由以下人员生成:

ionic start biblio tutorial --v2

ionic.config.json

{
  "name": "biblio",
  "app_id": "",
  "v2": true,
  "typescript": true
}

tsconfig.json

 {
  "compilerOptions": {
    "target": "es5",
    "module": "commonjs",
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true
  },
  "filesGlob": [
    "**/*.ts",
    "!node_modules/**/*"
  ],
  "exclude": [
    "node_modules",
    "typings/global",
    "typings/global.d.ts"
  ],
  "compileOnSave": false,
  "atom": {
    "rewriteTsconfig": false
  }
}

有什么想法吗？

Answer 1

对我来说，问题是当您在 Android 设备上进行远程调试时，Chrome 调试器无法访问设备上的源映射文件。解决方案/修复是内联包含源映射。为此，我:

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

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

这是为了让 webpack 添加源映射内联更改 tsconfig.js 行

"sourceMap": true,

到

"sourceMap": false

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

此更改后，一切似乎都运行良好。请注意，这适用于 ionic 2 RC_04