1. Create a new MVC project, add Easyui, and enable bundle compression

First, create a new MVC project, select Mvc4, and select the. NET FRAMEWORK4 Framework. Consider support for Server 2003 and select the. NET FRAMEWORK4 Framework.

Second, select the project template: Choose "Empty", View Engine: Choose "Razor".

Third, add easy UI

1. Right-click on "Manage NuGet packages"

2. Search online for Easyui, here is the 1.4.5 version, click Install. The "Content" and "script" two folders are automatically added to the project after the installation is complete.

Iv. enable bundled compression technology to output CSS and JavaScript compression to the page

1. Create a new BundleConfig.cs class under the App_star folder,

2, define the Registerbundles method, bundlecollection the object as the parameter, the code is as follows:

public static void Registerbundles (Bundlecollection bundles)
{

}

Note: Because there is no bundlecollection class, the hint is missing a reference. Workaround: The program adds a reference to System.Web.Optimization.dll, and a using System.Web.Optimization is added to the class.

If you manually add it, you cannot find it in the entire library: System.Web.Optimization namespace. Open the Package management console,

In the console, enter: Install-package Microsoft.AspNet.Web.Optimization press ENTER.

You see a prompt in the console: "Microsoft.AspNet.Web.Optimization 1.1.3" was successfully added to * * * *. Represents a reference in the project in which Microsoft.AspNet.Web.Optimization.dll has been added, you can find the "System.Web.Optimization" namespace and use the Bundlecollection object.

V. Registering the BundleConfig.cs class and adding namespaces in Web. config

1, BundleConfig.cs class written, in the Global.asax file Application_Start method Register, write a line: Bundleconfig.registerbundles ( Bundletable.bundles); and add a reference to System.Web.Optimization.dll

2. The namespace needs to be added in Web. config, there is a Web. config under the program directory, there is a Web. config under the View folder, and the following code is added to all two files:

<add namespace= "System.Web.Optimization"/>, specific position in the <namespaces></namespaces> node.

Vi. supplementing the Registerbundles method under the Bundleconfig class,

The code is as follows

1      Public classBundleconfig2     {3          Public Static voidregisterbundles (bundlecollection bundles)4         {5             //Easyui6Bundles. ADD (NewStylebundle ("~/content/themes/css"). Include ("~/content/themes/icon.css",7                                                                         "~/content/themes/color.css"));8Bundles. ADD (NewStylebundle ("~/content/themes/black/css"). Include ("~/content/themes/black/easyui.css"));9Bundles. ADD (NewStylebundle ("~/content/themes/bootstrap/css"). Include ("~/content/themes/bootstrap/easyui.css"));TenBundles. ADD (NewStylebundle ("~/content/themes/default/css"). Include ("~/content/themes/default/easyui.css")); OneBundles. ADD (NewStylebundle ("~/content/themes/gray/css"). Include ("~/content/themes/gray/easyui.css")); ABundles. ADD (NewStylebundle ("~/content/themes/material/css"). Include ("~/content/themes/material/easyui.css")); -Bundles. ADD (NewStylebundle ("~/content/themes/metro/css"). Include ("~/content/themes/metro/easyui.css")); -  theBundles. ADD (NewScriptbundle ("~/bundles/jquery"). Include ("~/scripts/jquery-{version}.js")); -Bundles. ADD (NewScriptbundle ("~/bundles/jqueryeasyui"). Include ("~/scripts/jquery.easyui-{version}.js")); -         } -}

Seven, the CSS and JavaScript compression output to the page, Web page reference Easyui framework, code:

1     @Styles. Render ("~/content/themes/css")2     @Styles. Render ("  ~/content/themes/gray/css")3     @Scripts. Render (" ~/bundles/jquery " )4     @Scripts. Render ("~/bundles/jqueryeasyui")

1. Create a new MVC project, add Easyui, and enable bundle compression