Some months ago, I posted info about minifying js & css files automatically, with web deployment projects:
http://www.luuuukke.net/post/minify-css-and-jss-script-with-visual-studio-web-deployment-projects.aspx
Now, that I plan to migrate some websites to Azure, I have to migrate my websites to web applications (easy, but quite annoying …)
So, I of course wanted to keep minifying those static files also, with web applications projects..;
I found an excellent article here, about minifying with the Ajax minifier
http://thefrontend.wordpress.com/2012/02/02/minify-javascript-and-css-files-when-publishing-web-applications/
Worth to read, as it explains all steps very clearly.
After testing, I preferred to keep using the Yahoo YUI Compressor…
(Got strange results sometimes with the Ajax minifier.)
It is in fact quite easy… all you have to do is:
Edit the application project file with a text editor (right click the application, “edit xxxx project file”)
(I did it even with the project open in Visual Studio, no problem, VS reloads it after saving in the text editor)
and then add a few lines of code at bottom, under “ </ProjectExtensions>”
The code should be something like:
<UsingTask TaskName="CompressorTask" AssemblyFile="..\..\..\..\SharedReferences\Yahoo.Yui.Compressor.dll" />
<Target Name="CompressJsAndCss" AfterTargets="CopyAllFilesToSingleFolderForPackage" Condition="'$(Configuration)'=='Release'">
<ItemGroup>
<CssFiles Include="$(_PackageTempDir)\App_Themes\**\*.css;$(_PackageTempDir)\CSS\*.css" />
<JavaScriptFiles Include="$(_PackageTempDir)\JavaScript\*.js" />
</ItemGroup>
<Message Text="Compressing JavaScript and CSS files..." Importance="high" />
<CompressorTask CssFiles="@(CssFiles)" DeleteCssFiles="No" CssOutputFile="%(rootdir)%(directory)%(Filename).css"
CssCompressionType="YuiStockCompression" JavaScriptFiles="@(JavaScriptFiles)" ObfuscateJavaScript="FoSho"
PreserveAllSemicolons="Yeah" DisableOptimizations="Nope" EncodingType="Default" DeleteJavaScriptFiles="No"
JavaScriptOutputFile="%(rootdir)%(directory)%(Filename).js" LoggingType="ALittleBit" />
</Target>
You’ll have to adapt the path to YUI compressor (mine is in a folder where I put shared libraries, under source control too)
and also, adapt the files selector up to your needs (values of the “include” parameters of the CSSFiles & JavascriptsFiles nodes)
A few trial & error should bring you the results you wish.
The YUI Compressor has lots of options, which you can find here: http://developer.yahoo.com/yui/compressor/
And, at the time you read this, Visual Studio 2012 will certainly be released, and doing this automatically 