Notice: The Monaca & Onsen UI Community Forum is shutting down.
For Onsen UI bug reports, feature requests and questions, please use the Onsen UI GitHub issues page. For help with Monaca, please contact Monaca Support Team.
Thank you to all our community for your contributions to the forum. We look forward to hearing from you in the new communication channels.
USB debug with sources / breakpoints
-
According to the Monaca site, it is possible to put breakpoints in source code when debugging on a device via USB.
How is this done?
Monaca does not generate source maps so there is no way to step through the original source.
Please don’t answer with “check the Chrome Dev Tools documentation”.
I know how to inspect the device in Dev Tools. The problem is that all I can see is the transpiled app bundle, not the original source.
Thank you.
Re: LocalKit Debugger Chrome Dev Tools - How to add breakpoints to source?
-
@ephraimt I found an issue in the webpack dev configuration. We are currently using
eval-source-mapto generate the source map, but it seems that it’s bugged (breakpoints can be added but the execution does not stop). Check the following issue in the official Webpack repository.To fix it and to be able to debug, open your
/projectName/webpack.dev.config.jsfile and changedevtool: 'eval-source-map',with
devtool: 'inline-source-map',It will fix the issue (I made the screenshot with a Vue template, but React templates work as well):
