VS2010 Automatically rebuild minified .js/.css files

Question

Problem:

---

I have been trying to integrate minification of javascript and css files in our VS2010 (.net 4.) projects. From what I hear, .net 4.5 and VS2012 will have minification build into the editor, so it will be as easy as setting a flag it will work. Unfortunately we are sill on VS2010 (.net 4.0).

Let me explain what I want to do and what I dont want to do.

I dont want to do big setups with classes/config file(s)/etc just to minify because all that stuff will have to be loaded on our build machine and even the build xml files might have to be modifies to make it work. Also, once we go to vs2012 and .net 4.5 all these configs/classes/etc will have to be discarded because vs2012 will have the build in functionality.

Here is what I think might be the best option. Since I am using the ScriptManager and it can already pull either a .debug.js (non-minified) or a .js (minified) script based on the build type, it seems all i need to do is to have some sort of (pre?) build event that will re-build a non-minified .js file into a minified one. Obviously the build event will have to call a minication module which would have to be installed on local computer (the YUI Compressor seems very nice). The module would update the minified .js file.

I have been reading about this, but I am getting a little bit lost. There are a lot of third party tools with bunch of setup and classes which I do not want to add. Did anyone do something similar as I explained about? If not what is the next best simple solution?

(By the way, if you are going to say move to VS2012/4.5, thats not a solution for us at this point)

Solution:

---

Thank you Parv Sharma for your answer.

I would just like to explain what I did so that it may help someone in the future.

1. I installed the Microsoft Ajax Minifier
2. Created a batch file to add minifer to ENVIRONMENT PATH variables: setx path /m "%PATH%;C:\Program Files\Microsoft\Microsoft Ajax Minifier"
3. Added the following pre-build events into my project: ajaxmin $(ProjectDir)Script.js -out $(ProjectDir)Script.min.js -clobber

If Script.min.js does not exist, it will be created by the build event, but it will not be added to the project (not sure how to do that through the events).

When you add a new script file, mynewscript.js, just create a second blank file called mynewscript.min.js and add an pre-build event for it.

Using this approach the only thing you have to do to the build machine is run the Microsoft Ajax Minifier setup package and the batch file. Thats it everything else will be part of your pre-build events.

Answer 1

what you are looking for is probably this
http://ajaxmin.codeplex.com/documentation
by using this you would be able to use this third party tool as the minifier
after downloading the tool you have 2 options
1. edit the MSBUILD file to include building the js as per build event
OR 2. to attach this tool to VS and assign a key compbination to it.. this way you would be able to minify whenever you want just like we do F5 OR Cntrl-Shift-B

Attaching to VS is easy just to to external tools and in the Tools menu and add this tool with the required params