Search code examples
javascriptsingle-page-applicationminifybundling-and-minificationuglifyjs

UglifyJS append files without removing whitespace


I'm using UglifyJS to mangle and compress the JavaScript code of my SPA. This is ok for production, however I'd like to just append all the JS files when compiling in debug mode.

I tried omitting the -c -m options (compress & mangle) but it didn't work, it just keep compressing and mangling the source files

I'd like to avoid using another tool or even worst writing my own to just append a set of JavaScript files

EDIT

test0.js input file:

var test1 = 0;
var test2 = 1;
var test3 = test1 + test2;

test1.js input file:

var test4 = 0;
var test5 = 1;
var test6 = test4 + test5;

command I run (no mangling nor compression specified):

uglifyjs test0.js test1.js -o out.js

output I get:

var test1=0;var test2=1;var test3=test1+test2;var test4=0;var test5=1;var test6=test4+test5;

output I would expect:

var test1 = 0;
var test2 = 1;
var test3 = test1 + test2;
var test4 = 0;
var test5 = 1;
var test6 = test4 + test5;

I can confirm UglifyJS is stripping out all the CR/LF bytes from the files, I'd like to avoid that

enter image description here


Solution

  • Taking your example we can see that uglify does in fact neither mangle nor comporess your code. It simply removes whitespace.

    This happens because (as most things that handle code on a meta-level) your code is parsed to an AST. This is an abstract represenation of your source code that only contains actual commands.

    This means any formatting is lost as more or less the very first step that uglify does and there is no way to recover it.

    See also this issue. The better way to achieve traceability when developing is by using source maps, which uglify can generate with the --source-map option.

    This will create a separate file .map that lives beside your uglified file and contains the information about which line contains what code.