How to automatically update or compress a CSS, JS and HTML file every time I save its "source file" in Vim?

Question

I wanted to minimize or compress CSS, Javascript and maybe Html files like Google does. Because, I used Google's Page-Speed and it recommended me to compress files. It provides me the compressed versions but I would like to do this automatically.I don't want to deal with 2 files every time I want to edit something. So basically, I want to have 2 files in a folder, for instance, style.src.css and style.css.

I want to know how to do the following:

1. Update the ouput file everytime I edit the input file.
2. A command that automatically compress CSS, Html, and Javascript files.

Thanks in advance.

Answer 1

You should be able to have vim do that. A bit of reading on the vim autoscripts ( http://vimdoc.sourceforge.net/htmldoc/autocmd.html ) would be helpful, but here's a decent guess:

au BufWritePost *.html !zip %.zip %

In .vimrc

Answer 2

YUI Compressor isn't VIM and is usually done manually, at build time, but you can instantiate YUI Compressor on-the-fly to handle minification on your server (requires Java).

Note that YUI Compressor minifies JS and CSS (not HTML). Compression can also be done on the server, reducing file sizes even more.