Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Make ASP.NET bundling specify media=screen for CSS bundle

I'm just trying out ASP.NET 4.5 bundling and minification, and ran into an issue.

I've got around 10 css files, of which 2 were originally referenced in the layout using the attribute media="screen".

Since the syntax for adding a css to the bundle does not let you specify that such attribute should be added (makes sense, since the attribute would apply for the whole bundle), I was hoping to see an overload of @Styles.Render that would allow me to specify html attributes, like in other Html helpers, but there is none.

There is an ugly solution, in which since I know the url of the bundle created, i could just craft the tag myself, but I'd lose the caching mechanism that is handled by ASP.NET by allowing it to render the tag itself.

Is there a way to do this, am I missing something? Or is this just an oversight of the design team?

like image 367
GR7 Avatar asked Aug 20 '12 17:08

GR7


People also ask

What is ASP NET bundling?

Bundling is a new feature in ASP.NET 4.5 that makes it easy to combine or bundle multiple files into a single file. You can create CSS, JavaScript and other bundles. Fewer files means fewer HTTP requests and that can improve first page load performance.

What is bundling and minification in web application development?

ASP.NET Core Bundling and Minification are two distinct techniques that can be used to improve page load performance for web applications. In ASP.NET Core bundling & minification is not available by default and needs to be implemented for a web application.

How do I use design-time bundling and minification in ASP NET Core?

ASP.NET Core doesn't provide a native bundling and minification solution. Third-party tools, such as Gulp and Webpack, provide workflow automation for bundling and minification, as well as linting and image optimization. By using design-time bundling and minification, the minified files are created prior to the app's deployment.

Does the minified CSS file need to be in the bundle?

The minified CSS file does not need to be listed in the bundle. In most cases, you’ll just want the default style link rendering, which is how the file Site.css is included in the Master Page in the default WebForms project.


1 Answers

I've found a more elegant solution.

I'm using the Styles.RenderFormat(format, bundle).

I have a BundlesFormats class with a property called PRINT and I use it like so:

public class BundlesFormats {     public const string PRINT = @"<link href=""{0}"" rel=""stylesheet"" type=""text/css"" media=""print"" />"; } 

And in the cshtml:

@Styles.RenderFormat(BundlesFormats.PRINT, "~/bundles/Content/print") 
like image 192
Adam Tal Avatar answered Sep 21 '22 20:09

Adam Tal