在Visual Studio代码中调试Ionic 2-如何在源文件中命中断点？

Drenai 发表于 Dev

引流

问题：仅在串联的构建文件www \ build \ js \ app.bundle.js中命中了断点

复制

我启动模拟器，在模拟器上运行应用程序（运行良好）
在应用文件夹文件中设置一些断点，例如 app/pages/list/list.js
在“ VS代码”>“调试窗格”中，选择Attach to running Android on Emulator。调试器运行并连接。

实际结果

原始源文件中没有命中断点。如果我在构建js文件中设置它们，它们只会被命中www\build\js\app.bundle.js

关于源贴图的注意事项

在中MyIonic2Project\.vscode\launch.json，“附加到在模拟器上运行”配置的设置为：

"sourceMaps": true,
"cwd": "${workspaceRoot}",
"ionicLiveReload": false

我的设定

这是一个Ionic 2项目，使用以下命令创建：

ionic start --v2 -a "My Ionic 2" MyIonic2Project tutorial

这对于cli命令非常有效：在具有的Chrome上ionic serve，ionic emulate android在和上使用emulator以及在设备上（HTC One M8），因此到目前为止一切都很好:-)

我已经安装了最新的Visual Studio Code，并包括了Cordova工具：ext install cordova-tools

引流

我还有其他信息，但是评论太久了，因此请输入答案。如果需要更新，请提供反馈。

在Ionic 2论坛上，以下是直接在VSCode TypeScript文件中进行调试的教程的链接。

为简洁起见，使用Ionic CLI扩展名。还需要针对VSCode的Chrome扩展程序的调试器。

从Visual Studio代码在Chrome中调试Ionic 2应用程序 http://www.damirscorner.com/blog/posts/20161122-DebuggingIonic2AppsInChromeFromVisualStudioCode.html

更新：有关使此功能在手机上运行的详细信息，请参见@Kinorsi评论

GitHub上有一个相关的问题-已经存在Closed，可能值得注意。解决方案是Ionic 2 RC构建系统不再使用gulp。关于内联源映射的使用，还有进一步的评论"ionic_source_map_type": "#inline-source-map"：TypeScript源文件无法在Android＃22的真实移动设备上调试

本文收集自互联网，转载请注明来源。

如有侵权，请联系 [email protected] 删除。