About

Minification, compression, combination, and caching of JavaScript and CSS resources for ASP.NET and ASP.NET MVC web applications.

Setup

Add references to your project
  • WebPacker.dll
  • WebPacker.Mvc.dll (for ASP.NET MVC)
  • WebPacker.NLogLogger (for logging with NLog)
  • WebPacker.DotLessFilter (if LESS filter required)

Register the configuration section and WebPacker configuration in the web.config

<configSections>
  <section name="web.packer" type="WebPacker.Configuration.WebPackerSection, WebPacker" />
</configSections>

<web.packer enabled="true">
  <provider type="memory" url="/webpacker.axd" />
  <filters>
    <filter type="WebPacker.Filters.YuiCssMinifier" />
    <filter type="WebPacker.Filters.YuiJavascriptMinifier" />
  </filters>
  <packs source="~/Packs.config" />
</web.packer>
Full description of the configuration you can see here.

Create a packages definition file that pointed in configuration

In the example above it is a file "~/Packs.config"

<packs monitoring="true" versionGenerator="lastModified">
  <pack name="styles" type="css" basePath="~/content">
    <resources>
      <item>reset.css</item>
      <item>site.css</item>
    </resources>
  </pack>
  <pack name="scripts" type="javaScript" basePath="~/scripts">
    <resources>
      <item>jquery-1.5.1.js</item>
      <item>jquery.validate.js</item>
    </resources>
  </pack>
</packs>
Feel free to modify packages definition file online. It doesn't require restarting the web application.

Register the WebPacker route

In global.asax code-behind file:
  1. Import WebPacker and System.Web.Routing namespaces
  2. Add this to the first line of either RegisterRoutes() or Application_Start():
RouteTable.Routes.AddWebPackerRoute()
Register namespace WebPacker on a pages

Add following line to the configuration section system.web/pages/namespaces in web.config:
<add namespace="WebPacker"/>

Usage

ASP.NET MVC

You can include package by name

@Html.CssPack("styles")
@Html.ScriptPack("scripts")
Or you can generate it on the fly

@Html.CssPack(new [] { "~/content/reset.css", "~/content/site.css", "~/content/page.css" })
@Html.ScriptPack(new [] { "~/scripts/jquery-1.5.1.js", "~/scripts/main.js" })

ASP.NET

<%=WebPackerHtml.CssPack("styles")%>
<%=WebPackerHtml.CssPack(new [] { "~/content/reset.css", "~/content/page.css" })%>
<%=WebPackerHtml.ScriptPack("scripts")%>
<%=WebPackerHtml.ScriptPack(new [] { "~/main.js" })%>

Last edited Sep 21, 2011 at 4:41 PM by pshkarin, version 8