0

I'm just trying out browserify, and I can't get it working with source maps. In package.json I have:

"build": "browserify --debug myApp.js -o bundle.js"

I run it with npm run build, and it generates a bundle.js file that has at the bottom a line like this, which I'm assuming is the source map:

//# sourceMappingURL=data:application/json;charset:utf-8;base64,eyJ2ZXJzaW9uIjozLCJz....

When I open my index.html in Chrome, it's working - all of myApp.js is compiled into bundle.js and is fully functional. But in dev tools/sources I only see the compiled bundle.js. I have 'enable Javascript source maps' turned on, and I'm using Chrome 45. Is there something else I'm supposed to be doing to get code maps working? Thanks.

I've also tried piping through exorcist to create a bundle.js.map instead. Still doesn't work.

thund
  • 1,842
  • 2
  • 21
  • 31

1 Answers1

2

Figured it out. Browserify was working fine - the //# sourceMappingURL=... line is all that's needed for source maps to work. However, for source maps to be visible in Chrome (45), you need to load the page with the developer tools panel closed, and then you need to open it. If you do things in that order, you'll see the original source files listed correctly as per source mapping.

If, however, you reload the page with the developer tools panel already open, all you see are the compiled source files. Personally I'd call this a bug.

thund
  • 1,842
  • 2
  • 21
  • 31