The obvious solution is to combine all my scripts into one file and minify. I’ve done this several times before, but I needed to make sure that certain files loaded in a certain order, so I whipped up a shell script to ensure some of the files are pushed to the front of the line.
Having never really done that much shell scripting before, this wasn’t the easiest task for me. To help save others some time, I’ve attached my script and documented it pretty well. Let me know if you have any questions!
Above, you’ll see our (sample) folder structure. Under the models subfolder, we have tab.js, which needs to be loaded before subtab.js.
Below, you’ll see the gist of what I’m doing. If you have any sort of shell experience, I’m sure this isn’t a revelation, but I wish I had something like this when I started writing earlier today!
A few things to note:
- I highly recommend adding this code as a git hook, if you want your combined JS to be in source control
- The heavy lifting is done with the fabulous YUI Compressor, which requires Java to be installed (It also does CSS minification).
- Remember to chmod your compression script to allow you to execute or else it won’t work!