I'll create some more posts after this to help you fully automate the creation of source-maps using Grunt, npm, Lint etc. - but first let's start with the basics:
Now in reality - we would like to see this in the debugger:
So even though the browser receives a minified file, when debugging we want the real thing.
By convention, any minified JS can have a final line telling the browser that there is help material for debugging - like this:
Thanks to this piece of magic the browser will now show you the original code when debugging. You can even set break-points and everything. This is awesome!
Hope this helps you!
With love from Switzerland,
Daniel Mettler grew up in the jungles of Indonesia and is founder and CEO of 2sic internet solutions in
Switzerland and Liechtenstein, an 20-head web specialist with over 600
DNN projects since 1999. He is also chief architect of 2sxc (2SexyContent - see forge), an open source module for creating attractive content and DNN Apps.