Debugging Cordova App with Webpack sourcemaps

Question

Angular2 + TypeScript + Webpack Cordova app - I want to be able to debug original TypeScript files on my Android phone when debugging app using Chrome.

What is additionally needed to configure in order for the sourcemap to also work in a remote mobile device running cordova app bundled by Webpack?

Will add current configurations on demand.

Answer 1

Solved the problem by using: devtool: 'inline-source-map'

Answer 2

I was able to get it to work with devtool: 'source-map' after loading up devtools in chrome I go to sources tab and then sub-tab 'filesystem' (aside to 'page' sub-tab)

After that I click on add folder to workspace and select the www folder under project with the source files

I then right click a file and copy link address (should look something like: file:///fullPathTo/www/16.df2fe1ccd913c5c02ad1.js.map

Then I go to the 'Page' sub-tab and select a minimized file not mapped and manually select mapping file by right clicking file display area and selecting "Add source map..." pasting the address given above and clicking add.

Now the source map works as usual for web pack with 'webpack' folder appearing in the sources tree.