So I'm using Browserify and Minifyify to bundle up some JS source code, and generate source maps.
Minifyify claims to point back to the original source files, but when I look at the source maps in Chrome, what I see are minified versions of the original files. And any stack traces in console errors always show line 1, since all of the code is then in a single line.
Is this the expected behavior of Minifyify, and if not, is there something else I need to do to get source maps with the original source?
My setup looks like this:
var hbsfy = require("hbsfy").configure({
extensions: ["html"]
});
var fs = require('fs');
var opts = { debug: true };
var browserify = require("browserify");
var scriptFile = './app.js';
var outputFile = './build/app.min.js';
var mapFile = 'app.min.map';
var mapOutput = './build/app.min.map';
var b = new browserify(opts);
b.add(scriptFile);
b.transform(hbsfy);
b.plugin('minifyify', { map: mapFile, output: mapOutput });
b.bundle().pipe(fs.createWriteStream(outputFile));
So I figured out the problem. It was a bug in Minifyify on Windows related to the different path separators. A quick fix is to edit the minifier.js file and add this line to the top of Minifier.prototype.transformer:
file = file.replace(new RegExp('\\' + path.sep, 'g'), '/');
For future reference, this bug was in v4.0.3, and most likely all previous versions. I submitted the info to the author, so hopefully it will be fixed in the next version.
I've only used it with the cli.
But looking at the docs it looks like your last line is the issue.
try:
b.bundle(function (err, src, map) {
if (err) {
throw err;
}
fs.writeFile(outputFile, src);
fs.writeFile(mapOutput, map);
});
Also you don't need debug: true
This is the problem: https://github.com/substack/node-browserify/commit/dddc29673186c1dfe3f99d2af5bef02c51df12f0
Simplest workaround I can see is to use the last version of browserify before 6.0.0 until minifyify (and uglifyify) are corrected to account for this change.