Posted By

iloveitaly on 07/11/09


Tagged

css javascript js debug gzip compression


Versions (?)

Compression Script for CSS & JS


 / Published in: Bash
 

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

  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  

You need to login to post a comment.