2

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));
Improve this question

3 Answers 3

Reset to default
3

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.

Improve this answer
Sign up to request clarification or add additional context in comments.

Comments

1

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

Improve this answer

7 Comments

That gives me the same output as using pipe(). Also FYI if I don't set debug: true, minifyify throws an exception "Run browserify in debug mode to use minifyify." Do you get the correct non-minified source maps when using the CLI? I feel like I tried it before and got the same output, but I will give it a try again too.
I'm using browserify -e client.js -p [minifyify --map /bundle.map.json --output public/bundle.map.json] -o public/bundle.js works like a charm
Hmm, I tried the same command line. First it wouldn't work because it complained that I needed to run browserify in debug mode, and when I did that it gave me basically the same output, with the same result in the browser. The map file has all of the correct absolute paths listed at the beginning of the file, but then it just seems to also have all of the minified code embedded which is what is getting resolved in the browser. Would you mind telling me what version(s) of browserify and minifyify you're using?
"browserify": "^4.2.3", "minifyify": "^3.0.12", node v0.10.29
Thank you. I'm using v.5.9.1 of browserify and v4.0.3 of minifyify. I'm going to see if I can get the versions you are using and see if it makes a difference.
|
0

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.

Improve this answer

1 Comment

This may or may not be a problem now but it has nothing to do with the problem I was having, which was a matter of minifyify not normalizing the path separators for paths that were used as keys in an associative array, resulting in failed matches from browserify's paths on Windows. It was fixed a few days after I posted this question.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.