minification is applied after eval(...) wrappers

[mere]

if useSourceUrl = true, and optimize = "uglify", the minification/uglification process is applied at the wrong time:

Current result:

1. all file contents get wrapped in eval("...") calls.
2. the minification is applied.
   At the time of the minification the file contents are represented as strings inside the eval() call, so they are left as they are. No minification/uglification applied

Expected result:

1. minification should be applied fist
2. once they are minified, they should be wrapped up in the eval("...") calls.

I hope it made sense.

Cheers,
Zoltan

[jrburke]

I assumed that if useSourceUrl was true that optimize was set to none, otherwise, the minification rendered debugging fairly useless. However, what has been your experience?

[mere]

Hi James, thanks for the quick response! :)
Your useSourceUrl feature works really well in the Chrome dev tool, pointing to the right file.

The DevTool Sources tab has a "pretty print" feature that reformats minified code.
Once enabled, the code is displayed nicely formatted, also, it shows the exact location of all Errors, console warnings and console errors.

The 2 combined would be fantastic: single file, small file size and easy-to debug code.

Example: An error is thrown in my app.js (dummy project)

1. optimize: "uglify" , useSourceUrl: false:
   Hard to tell which file threw the error, since everything is in main.js and uglified. Not cool.
   
2. optimize: "uglify" + chrome pretty print:
   Easy to see where the error is thrown, but there's no way of telling which file threw it.
   
3. optimize: "uglify" + useSourceUrl : true
   Pure awesomeness, I can see which file threw the error and I can see that it was thrown by app.js and not main.js
   
   The only downside is that the code is not minified (hence this ticket)

Cheers,
Zoltan

[jrburke]

OK, the 2.1.2 train is out the door, but marking this for consideration in 2.1.3. It may not work out, in this precise way, maybe there is something with sourcemaps that would make this easier. Also may get pushed out later depending on impact.

[mere]

Thanks James!

[jrburke]

Looks like this will be awkward to do without a larger rewrite. In particular, the place that does the minifying does some work with a pluginCollector that then interacts with loader plugins, where the part that does the toSourceUrl work is separate. So going to punt on this until a 3.0.

In the meantime, you could manually do it by making a node program that loads r.js as a module and loads uglifyjs as a module, then calls requirejs.optimize() with an onBuildWrite hook, and set useSourceUrl: false, optimize: 'none'. Then in the onBuildWrite hook, do the uglify call manually using the imported uglify, append sourceURL comment, then convert all of that to a JS string, and pass it to eval(), and return that whole string from onBuildWrite.

So a bit awkward since it is more manual, but hopefully a 3.0 would be able to rework some of the r.js logic.

[mere]

Thanks James,
I created a wrapper for r.js to break down the optimisation, minification and post processing(eg. creating the paths json for the bundled packages) into separate chainable(q.js) steps.

Everything is working fine now, thank you for your help.
I had to patch r.js to resolve a small issue with the source maps (it creates invalid comment type for IE8) and another issue related to uglify (Compressor options are not passed onto uglifyJs). I'll raise these as separate issues/pull requests later this week.

[jrburke]

@mere ok -- you may try the latest master r.js as it has an updated uglifyjs2, and it seems to be easier to pass 'uglify2' settings, if that was the optimize value you were using. Examples for master/soon-to-be-released 2.1.3:
https://github.com/jrburke/r.js/blob/master/build/example.build.js#L156

[julesbou]

Hello there,

I'm trying to get sourceMaps working with minification, I can't get it working for now, is there a live example somewhere (a project/a seed/..) where minification and sourceMap works together? Thanks.

EDIT: I'm having the exact same issue, i tried with uglifyjs2 and latest r.js.