How to enable sourcemaps using grunt, browsify and babelify

Question

I would like to generate source files for jsx files that are transferred using babelify and browser. It looks like some source files are generated as a base64 encoded comment at the bottom of my output file, but stacktraces do not respect them.

My grunt task is as follows:

browserify: { options: { browserifyOptions: { debug: true }, debug: true, transform: ['babelify'] }, app: { src: 'src/app.jsx', dest: 'dist/app.js' } }, 

Answer 1

This works for me:

 browserify: { dev: { options: { browserifyOptions: { debug: true }, transform: [["babelify"]] }, files: { "dist/bundle.js": "src/index.js" } } }, 

Answer 2

You will need to use grunt-exorcise to extract the card from the package.

Browserify recommends it

 browserify: { options: { browserifyOptions: { debug: true }, debug: true, transform: ['babelify'] }, app: { src: 'src/app.jsx', dest: 'dist/app.js' } }, exorcise: { app: { options: {}, files: { 'dist/app.js.map':['dist/app.js'], } } },