Created
October 14, 2010 20:31
-
-
Save iloveitaly/626989 to your computer and use it in GitHub Desktop.
Combine & compress multiple css / js files
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
#!/bin/bash | |
# move to the directory which the script is placed in | |
# all file refences will be based off this location | |
cd `dirname $0` | |
# == Configuration Options == | |
CSS_OUTPUT_FILE='css/core.css' | |
JS_OUTPUT_FILE='js/core.js' | |
JAVASCRIPT_FILES=( | |
js/util/mootools.js | |
js/util/mootools-more.js | |
js/util/validator.js | |
js/util/auto-clear.js | |
js/ui/datepicker.js | |
js/util/loop.js | |
js/ui/slideshow.js | |
js/util/swfobject.js | |
js/ui/autocomplete/Autocompleter.js | |
js/ui/autocomplete/Autocompleter.Request.js | |
js/ui/autocomplete/Observer.js | |
js/util/common.js | |
js/common.js | |
) | |
CSS_FILES=( | |
css/lib/reset.css | |
css/lib/forms.css | |
css/lib/typography.css | |
css/lib/screen.css | |
css/lib/structure.css | |
css/pages/testimonials.css | |
css/structure.css | |
css/lib/plugins/autocompleter.css | |
css/lib/plugins/datepicker.css | |
css/lib/plugins/slideshow.css | |
css/pages/seminar.css | |
css/pages/video.css | |
css/pages.css | |
) | |
# == End Configuration Options == | |
generate_js_include() { | |
echo "document.write('<script src=\"/includes/$1\" type=\"text/javascript\" charset=\"utf-8\"></script>');" | |
} | |
generate_css_include() { | |
echo "@import \"/includes/$1\";" | |
} | |
if [[ "$USER" == "Mike" ]]; then | |
DEVELOPMENT=1 | |
else | |
DEVELOPMENT=0 | |
fi | |
if [[ -e $HOME/scripts/yuicompressor.jar ]]; then | |
CSS_OPTIMIZER='cssoptimizer' | |
JS_OPTIMIZER="$HOME/scripts/yuicompressor.jar" | |
else | |
CSS_OPTIMIZER='cssoptimizer' | |
JS_OPTIMIZER='/usr/bin/yuicompressor.jar' | |
fi | |
if [ $DEVELOPMENT == 1 ]; then | |
> $JS_OUTPUT_FILE | |
for file in ${JAVASCRIPT_FILES[@]}; do | |
generate_js_include "$file" >> $JS_OUTPUT_FILE | |
done | |
> $CSS_OUTPUT_FILE | |
for file in ${CSS_FILES[@]}; do | |
generate_css_include $file >> $CSS_OUTPUT_FILE | |
done | |
# we dont want the server trying to serve the wrong data | |
if [[ -e "$CSS_OUTPUT_FILE.gz" ]]; then | |
rm "$CSS_OUTPUT_FILE.gz" | |
fi | |
if [[ -e "$JS_OUTPUT_FILE.gz" ]]; then | |
rm "$JS_OUTPUT_FILE.gz" | |
fi | |
exit 0 | |
fi | |
# Darwin is assuming os x | |
if [[ `uname` == "Darwin" ]]; then | |
tempFile=`mktemp -t webcompress.xxx` | |
else | |
# mktemp on server runs differently than the os x version | |
tempFile=`mktemp` | |
fi | |
# Compress CSS | |
for file in ${CSS_FILES[@]}; do | |
# count /'s.. if we are father down in the directory replace ../../../ with ../ | |
if [[ `echo "$file" | perl -ne 'while(/\//g){++$count}; print "$count\n"'` > 2 ]]; then | |
cat $file | sed 's/\.\.\/\.\.\/\.\.\//..\/..\//g' >> $tempFile | |
else | |
cat $file >> $tempFile | |
fi | |
done | |
"$CSS_OPTIMIZER" -lo $tempFile > $CSS_OUTPUT_FILE | |
# the IE file needs to be compressed | |
# whitespace causes issues with IE | |
# we have to do this round-about compression b/c of a bug in cssoptimizer | |
cp 'css/lib/ie.css' 'css/lib/ie2.css' | |
"$CSS_OPTIMIZER" -lo 'css/lib/ie2.css' > 'css/lib/ie.css' | |
# Compress JS | |
> $tempFile | |
for file in ${JAVASCRIPT_FILES[@]}; do | |
cat $file >> $tempFile | |
done | |
java -jar "$JS_OPTIMIZER" --type js "$tempFile" > "$JS_OUTPUT_FILE" | |
# gzip compress, but keep the original core.css in addition to the newly created core.css.gz | |
gzip -fc "$JS_OUTPUT_FILE" > "${JS_OUTPUT_FILE}.gz" | |
gzip -fc "$CSS_OUTPUT_FILE" > "${CSS_OUTPUT_FILE}.gz" | |
exit 0 |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment