CODEWITHSUNDEEP
asp.net-mvcminifyportable-areas
Luka
Luka

Reputation: 4211

MVC 4 Portable Areas CSS/JS minification

I used MVC 3 + Contrib Project PortableAreas to split my web to multiple projects. Now I moved to MVC 4 and want to use new feature minification for my css and JS.

But when I do: 

<link href="@Url.Content("~/DSB/Styles/CSS")" rel="stylesheet" type="text/css" />
<script src="@Url.Content("~/Scripts/common/js")" type="text/javascript">

instead of:

<link href="@Url.Content("~/DSB/Styles/Site.css")" rel="stylesheet" type="text/css" />
<link href="@Url.Content("~/Content/themes/smoothness/jquery-ui-1.8.12.custom.css")" rel="stylesheet" type="text/css" />
<script src="@Url.Content("~/Scripts/common/jquery-1.4.4.min.js")" type="text/javascript" />
<script src="@Url.Content("~/Scripts/common/jquery-ui-1.8.11.custom.min.js")" type="text/javascript"></script>

it does not work. How to use bundling/minification in Portable areas?

thanks

Upvotes: 0

Views: 1566

Answers (1)

Chris
Chris

Reputation: 12282

The problem here is that the bundling and minification does not foresee handling anything else than actual files. I have 2 solutions here that work.

Extract the files into temp files - requires write privileges for a folder within the app. Here is the code to handle that. It uses a directory called "Static" as the temporary target path. You can use it like this:

bundles.Add(new Rebundler(assemblyWithPortableArea, "~/VirtualPathUsedForResource")
                .Include("Fully.Qualified.Embeded.Resource.Name", "other...")
                .Rebundle());

Using it in a template is exaxctly as if you would use it in a non portable app, so @Scripts.Render() or @Styles.Render()

The other solution involves creating a bunch of classes that will allow you to use embeded resources. Here is the base class, and here are the script and style bundles. Here's the usage:

bundles.Add(new EmbededStyleBundle(assemblyWithPortableArea, "~/VirtualPathUsedForResource")
                .Include("~/AreaName/Content/themes/custom/jquery-ui.css"));

With this approach, you need to use this class to render the resources. So instead of using the @Scripts.Render() or @Styles.Render() the template code looks like this:

@Assets.RenderStyles("virtual path here")
@Assets.RenderScripts("virtual path here")

Note that this code is far from clean. It has been mostly reverse engineered and may skip a few paths, but it seems to work so far.

Upvotes: 1

Related Questions