Can you minify multiple files into one?

Question

I have my JavaScript code split into few files, all using the module pattern (updating one global variable, say MyApp, with new features and members.

Will it be possible to minify the files into one and not spoiling the scopes

Example I want to minify:

File1.js

var Module = (function(ns) {

 ns.fun1 = function() { alert('fun1'); };
 return ns;

})(Module || {});

File2.js

var Module = (function(ns) {

 ns.fun2 = function() { alert('fun2'); };
 return ns;

})(Module || {});

Answer 1

The global scope is in fact global, in that it doesn't matter if you are changing it from one file or multiple files. However, the order of your files can matter, depending on the module pattern flavour you're using. For a good writeup, covering cross-file private state also, read this: http://www.adequatelygood.com/2010/3/JavaScript-Module-Pattern-In-Depth

Answer 2

Yes you can, and is a good way to work, for everyone, especially if more developers are involved and healthy for the application.

I use the Minify class (http://code.google.com/p/minify/) with a special config file (https://beat.snipt.net/minify-config-file-minify-each-folder-from-project-1-minified-file/) that scans my folders and makes for each subfolder a file (JS or CSS). This way I can make modular JS or CSS files, that can be splitted on classes or regular files.

The key is the ORDER of the files, depending on the read-folder functions and OS type may be different (ex php readdir vs scandir)