Advanced Search

Compression Script for CSS & JS

/ Published in: Bash
Save to your folder(s)
A custom compression script I use for auto compression and gzip compression of my css & files. Also allows for 'debug' mode (uncompressed). You simply include the core.css & core.js in your

Expand | Embed | Plain Text

Copy this code and paste it in your HTML 
  1. #!/bin/bash
  2.  
  3. development=0
  4.  
  5. localAddress=`ifconfig  | grep -E 'inet.[0-9]' | grep -v '127.0.0.1' | awk '{print $2; exit 1}'`
  6. localAddress='your.localhost'
  7.  
  8. coreCSSOutputFile='css/core.css'
  9. coreJSOutputFile='js/core.js'
  10.  
  11. if [ $development == 1 ]; then
  12. 	cat > $coreJSOutputFile <<EOL
  13. document.write('<script src="/includes/js/mootools.js" type="text/javascript" charset="utf-8"></script>');
  14. document.write('<script src="/includes/js/validator.js" type="text/javascript" charset="utf-8"></script>');
  15. document.write('<script src="/includes/js/datepicker.js" type="text/javascript" charset="utf-8"></script>');
  16. EOL
  17.  
  18. 	cat > $coreCSSOutputFile <<EOL
  19. @import "lib/reset.css";
  20. @import "lib/typography.css";
  21. @import "lib/forms.css";
  22. @import "lib/plugins/tabs.css";
  23. @import "components/datepicker_dashboard.css";
  24. @import "admin.css";
  25. EOL
  26.  
  27. 	# we dont want the server trying to serve the wrong data
  28. 	if [[ -f "$coreCSSOutputFile.gz" ]]; then
  29. 		rm "$coreCSSOutputFile.gz"
  30. 	fi
  31.  
  32. 	if [[ -f "$coreJSOutputFile.gz" ]]; then
  33. 		rm "$coreJSOutputFile.gz"
  34. 	fi
  35.  
  36. 	exit 0
  37. fi
  38.  
  39. tempFile=`mktemp -t webcompress.xxx`
  40.  
  41. # Compress CSS
  42.  
  43. coreCSSFiles=(
  44. 	'css/lib/reset.css'
  45. 	'css/lib/forms.css'
  46. 	'css/lib/ie.css'
  47. 	'css/lib/typography.css'
  48. 	'css/screen.css'
  49. 	'css/components/datepicker_dashboard.css'
  50. )
  51.  
  52. for file in ${coreCSSFiles[@]}; do
  53. 	# count /'s.. if we are father down in the directory replace ../../../ with ../
  54. 	if [[ `echo "$file" | perl -ne 'while(/\//g){++$count}; print "$count\n"'` > 2 ]]; then
  55. 		cat $file | sed 's/\.\.\/\.\.\/\.\.\//..\/..\//g' >> $tempFile
  56. 	else
  57. 		cat $file >> $tempFile
  58. 	fi
  59. done
  60.  
  61. cat $tempFile > /out.css
  62. cssoptimizer -lo $tempFile > $coreCSSOutputFile
  63.  
  64. # Compress JS
  65.  
  66. javascriptFiles=(
  67. 	js/mootools.js
  68. 	js/validator.js
  69. 	js/datepicker.js
  70. )
  71.  
  72. # clear the tmp file
  73. > $tempFile
  74.  
  75. for file in ${javascriptFiles[@]}; do
  76. 	cat $file >> $tempFile
  77. done
  78.  
  79. java -jar /usr/bin/yuicompressor.jar --type js "$tempFile" > "$coreJSOutputFile"
  80.  
  81. # gzip compress!
  82.  
  83. gzip -f "$coreJSOutputFile"
  84. gzip -f "$coreCSSOutputFile"
  85.  
  86. exit 0

Report this snippet


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.