Sourcemap not working properly ( browserify + minify )

Question

The angular.js app I'm working on is currently built with Browserify, Minifyify and exorcist in order to have a single minified .js file and external sourcemap. The sourcemap are working but not completly. I can see the unbundled files in the web inspector and the right file is opened on breakpoints / exception which is good but not enough.

Every variable name appears under its minified form and the errors appearing in the debug console show the line in bundle.js rather than in the unbundled file.

I'm building the bundle with the following line :

$(BROWSERIFY) public/js/app.js --debug | $(MINIFYIFY) | $(EXORCIST) public/js/build/app_bundle.js.map > public/js/build/app_bundle.js

A simple example :

  WebDesktop.prototype.preview = function (url) {
    crash();
    $window.open(url);
  };

When this method is called, I get the obvious error :

ReferenceError: crash is not defined
at Object.p.preview (http://localhost:3000/js/build/app_bundle.js:109:490)
at l.o.viewAttachment (http://localhost:3000/js/build/app_bundle.js:157:2193)
at http://localhost:3000/js/build/app_bundle.js:12:27196
at http://localhost:3000/js/build/app_bundle.js:13:2335
at l.$eval (http://localhost:3000/js/build/app_bundle.js:11:23528)
at l.$apply (http://localhost:3000/js/build/app_bundle.js:11:23806)
at HTMLSpanElement.<anonymous> (http://localhost:3000/js/build/app_bundle.js:13:2317)
at HTMLSpanElement.o.event.dispatch (http://localhost:3000/js/vendor/offline/jquery.min.js:3:6055)
at HTMLSpanElement.r.handle (http://localhost:3000/js/vendor/offline/jquery.min.js:3:2830) angular.js:9778

but all the references are minified and in the main bundle.

I'm looking for advice to improve my sourcemap behavior and be able to fully debug my application.

Answer 1

Browsers right now don't support sourcemaps resolution in the stack trace.

Please refer to this issue:

https://code.google.com/p/chromium/issues/detail?id=330022&q=sourcemap%20stack%20trace&colspec=ID%20Pri%20M%20Iteration%20ReleaseBlock%20Cr%20Status%20Owner%20Summary%20OS%20Modified

and to this two SO questions:

AngularJS - Stack trace ignoring source map

Will the source mapping in Google Chrome push to Error.stack