compressing .js and .css files on push of the website

Question

I am not even sure if something like I want is possible, so I am asking you guys to just let me know if anyone did that before. So, my goal is to when I click on "Publish" website in VS2010, to have all javascript files compressed into one, same with css and then in my layout file change the references from all different js and css files to only those two merged ones. Is that doable? Or maybe it's doable but in more manual way?

Of course the goal here is to have only two calls to external files on the website, but when I develop I need to see all files so that I can actually work with it. I guess I could do it manually before each push, but I'd rather have it done automatically using some script or something. I didn't try anything yet, and I am not looking for ready solution, I am just looking to get to know the problem better and maybe some tips.

Thanks a lot!

Answer 1

This is built into ASP.net 4.5. But in the mean time, you should look at the following projects

• YUI Compressor
  • The objective of this project is to compress any Javascript and Cascading Style Sheets to an efficient level that works exactly as the original source, before it was minified.
• Cassette
  • Cassette automatically sorts, concatenates, minifies, caches and versions all your JavaScript, CoffeeScript, CSS, LESS and HTML templates.
• RequestReduce
  • Super Simple Auto Spriting, Minification and Bundling solution
  • No need to tell RequestReduce where your resources are
  • Your CSS and Javascript can be anywhere - even on an external host
  • RequestReduce finds them at runtime automatically
• SquishIt
  • SquishIt lets you squish some JavaScript and CSS. And also some LESS and CoffeeScript.
• Combres
  • .NET library which enables minification, compression, combination, and caching of JavaScript and CSS resources for ASP.NET and ASP.NET MVC web applications. Simply put, it helps your applications rank better with YSlow and PageSpeed.
• Chirpy
  • Mashes, minifies, and validates your javascript, stylesheet, and dotless files. Chirpy can also auto-update T4MVC and other T4 templates.

Scott Hanselman wrote a good overview blog post about this topic a while back.