How to add reference to System.Web.Optimization for MVC-3-converted-to-4 app

Question

I'm trying to use the new bundling feature in a project I recently converted from MVC 3 to MVC 4 beta. It requires a line of code in global.asax, BundleTable.Bundles.RegisterTemplateBundles();, which requires using System.Web.Optimization; at the top.

When I do this, I get the red squiggly lines that say, "Are you missing an assembly reference?" When I try and add reference, and click on the .NET tab in the dialog, sort from A-Z, I do not see System.Web.Optimization.

How do I add this reference to my project?

Answer 1

Update
Version 1.1.x is available, read the release notes: https://www.nuget.org/packages/Microsoft.AspNet.Web.Optimization

---

The Microsoft.Web.Optimization package is now obsolete. With ASP.NET (MVC) 4 and higher you should install the Microsoft ASP.NET Web Optimization Framework:

• Install the package from nuget:

  Install-Package Microsoft.AspNet.Web.Optimization
  

• Create and configure bundle(s) in App_Start\BundleConfig.cs:

  public class BundleConfig
  {
      public static void RegisterBundles(BundleCollection bundles) {
          bundles.Add(new ScriptBundle("~/Scripts/jquery").Include(
              "~/Scripts/Lib/jquery/jquery-{version}.js",
              "~/Scripts/Lib/jquery/jquery.*",
              "~/Scripts/Lib/jquery/jquery-ui-{version}.js")
          );
  
          bundles.Add(new ScriptBundle("~/Scripts/knockout").Include(
               "~/Scripts/Lib/knockout/knockout-{version}.js",
               "~/Scripts/Lib/knockout/knockout-deferred-updates.js")
          );
      }
  }
  

• Call the RegisterBundles() function from Application_Start() in your global.asax.cs:

  using System.Web.Optimization;
  
  protected void Application_Start() {
       ...
       BundleConfig.RegisterBundles(BundleTable.Bundles);
       ...
  }
  

• In your view.cshtml include the Optimization namespace and render the bundle(s):

  @using System.Web.Optimization
  
  @Scripts.Render("~/Scripts/jquery")
  @Scripts.Render("~/Scripts/knockout")
  

See http://www.asp.net/mvc/overview/performance/bundling-and-minification for more information

Answer 2

With the final released version of ASP.Net MVC 4 the approach is as follows:

• Install Microsoft.AspNet.Web.Optimization via nuget (as it is not installed by the framework)

  install-package Microsoft.AspNet.Web.Optimization
  

• Create the bundle in Global.asax Application_Start:

  var scripts = new ScriptBundle("~/MyBundle");
  scripts.IncludeDirectory("~/Scripts/MyDirectory", "*.js");
  BundleTable.Bundles.Add(scripts);
  

• Add the "System.Web.Optimization" namespace to the "Views" web.config:

   <pages pageBaseType="System.Web.Mvc.WebViewPage">
      <namespaces>
          <add namespace="System.Web.Optimization" />
      </namespaces>
  </pages>
  

• In your view.cshtml add an include to the bundle created in the last step:

  @Scripts.Render("~/MyBundle")
  

In debug mode, all script files in your directory will render individually; in release mode they will be bundled and minified.

Answer 3

Update (reinstall) the package from nuget, you can use the command:

update-Package Microsoft.AspNet.Web.Optimization -reinstall