ASP.NET MVC 4 Bundles

ASP.NET MVC 4中的新增加的类Bundle, 用来注册我们的JS跟CSS文件.

1

BundleTable.Bundles.RegisterTemplateBundles();

注册.NET MVC4模板中默认的Script与CSS, 具体包含的Script, CSS列举在下面，数据来源于Beta版本的 System.Web.Optimization.dll文件

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

publicvoid RegisterTemplateBundles()

{

    Bundle bundle = newBundle("~/Scripts/js",newJsMinify());

    bundle.AddDirectory("~/Scripts","jquery-*",false,false);

    bundle.AddDirectory("~/Scripts","jquery.mobile*",false,false);

    bundle.AddDirectory("~/Scripts","jquery-ui*",false,false);

    bundle.AddDirectory("~/Scripts","jquery.unobtrusive*",false,false);

    bundle.AddDirectory("~/Scripts","jquery.validate*",false,false);

    bundle.AddFile("~/Scripts/MicrosoftAjax.js",false);

    bundle.AddFile("~/Scripts/MicrosoftMvc.js",false);

    bundle.AddDirectory("~/Scripts","modernizr*",false,false);

    bundle.AddFile("~/Scripts/AjaxLogin.js",false);

 

    Bundle bundle2 = newBundle("~/Content/css",newCssMinify());

    bundle2.AddFile("~/Content/site.css",false);

    bundle2.AddDirectory("~/Content/","jquery.mobile*",false,false);

 

    Bundle bundle3 = newBundle("~/Content/themes/base/css",newCssMinify());

    bundle3.AddFile("~/Content/themes/base/jquery.ui.core.css",false);

    bundle3.AddFile("~/Content/themes/base/jquery.ui.resizable.css",false);

    bundle3.AddFile("~/Content/themes/base/jquery.ui.selectable.css",false);

    bundle3.AddFile("~/Content/themes/base/jquery.ui.accordion.css",false);

    bundle3.AddFile("~/Content/themes/base/jquery.ui.autocomplete.css",false);

    bundle3.AddFile("~/Content/themes/base/jquery.ui.button.css",false);

    bundle3.AddFile("~/Content/themes/base/jquery.ui.dialog.css",false);

    bundle3.AddFile("~/Content/themes/base/jquery.ui.slider.css",false);

    bundle3.AddFile("~/Content/themes/base/jquery.ui.tabs.css",false);

    bundle3.AddFile("~/Content/themes/base/jquery.ui.datepicker.css",false);

    bundle3.AddFile("~/Content/themes/base/jquery.ui.progressbar.css",false);

    bundle3.AddFile("~/Content/themes/base/jquery.ui.theme.css",false);

}

如果我们要自定义初以上列出的文件时我们需要:

在Global中的Application_Start中加入:

1

BundleTable.Bundles.EnableDefaultBundles();

EnableDefaultBundles方法的定义:

1

2

3

4

5

publicvoid EnableDefaultBundles()

{

    this.Add(newDynamicFolderBundle("js", JsMinify.Instance, "*.js"));

    this.Add(newDynamicFolderBundle("css", CssMinify.Instance, "*.css"));

}

在通过下面的方式加入自定义的js跟css文件

1

2

3

4

5

6

7

8

9

10

11

Bundle bundle = newBundle("~/Scripts/mjs",newJsMinify());

bundle.AddDirectory("~/Scripts/min","*.js");

BundleTable.Bundles.Add(bundle);

 

bundle = newBundle("~/Content/lofslidernews/used/css",newCssMinify());

bundle.AddFile("~/Content/lofslidernews/used/style2.css");

BundleTable.Bundles.Add(bundle);

 

bundle = newBundle("~/Content/simplyscroll/css",newCssMinify());

bundle.AddFile("~/Content/simplyscroll/jquery.simplyscroll.css");

BundleTable.Bundles.Add(bundle);