@Blog.Author(Nandip Makwana) .LearningExperience(ASP.NET, ASP.NET MVC, IIS, jQuery & Technology Surrounding it...)

December 25, 2011 comment , , , ,

ASP.NET 4.5 : Issue With CssMinify And Workaround For It

Before 2-3 days, while I was examining Bundling and Minification in ASP.NET 4.5. I observed problem with CSS3 minification while using default bundling which is available with Microsoft.Web.Optimization. Exploring more on it I found that there is a bug in CSS3 minification (while using nested parentheses) and it is already logged at

http://connect.microsoft.com/VisualStudio/feedback/details/696436/microsoft-web-optimization-cannot-compress-css3-animations
and
http://connect.microsoft.com/VisualStudio/feedback/details/689523/bugs-in-microsoft-web-optimization

Later I thought that why not create custom transform type for CSS3 which can be used with Bundling and Minification till above bug got fixed in next release. So I started to search for any open source module for CSS3 minification as I was not interested in creating my own buggy module (because it may possible, I might forget to include some possible CSS3 syntax). After searching and testing a few modules I came across to JavaScript port of YUI Compressor which is available at http://tools.w3clubs.com/cssmin/ and in my test YUI Compressor pass all cases. Luckily today I found a C# port of YUI Compressor on codeplex. Thanks to Pure Krome for this work. So with the help of C# port of YUI Compressor, I have created custom transform type for CSS3 minification which can be used with ASP.NET 4.5 and MVC 4 application. CSS3Minify transform type can be downloaded from here.

To use this transform type with Bundling and Minification download it from here and add downloaded class file into your ASP.NET 4.5 or MVC 4 application. You do not need to add reference to YUI Compressor.

Open Global.asax.cs file and in Application_Start event add following two lines.

DynamicFolderBundle Css3Bundle = new DynamicFolderBundle("css3", typeof(CSS3Minify), "*.css", false);
 
BundleTable.Bundles.Add(Css3Bundle);

That’s it now you should get your CSS3 minified. However this is temporary workaround till this bug got fixed in next version of Microsoft.Web.Optimization.

Let me know if you found any problem with this.

comments powered by Disqus

Featured Content

Resources & Tools

About Nandip Makwana

Nandip Makwana is passionate about digital world and web. He completed his Masters in Computer Application in June 2011. Currently he is working as a Software Engineer. He has shown great promise and command over ASP.NET and technologies surrounding it during his academic years and professorial life...continue reading