ASP .NET MVC - BundleCollection

 

首先我们需要在 Application_Start() (Global.cs 文件下)

来注册 BundleConfig 以获得 Bundle 的支持

protected void Application_Start()
{
            AreaRegistration.RegisterAllAreas();
            FilterConfig.RegisterGlobalFilters(GlobalFilters.Filters);
            RouteConfig.RegisterRoutes(RouteTable.Routes);
            BundleConfig.RegisterBundles(BundleTable.Bundles);
}

 

 

在 App_Start 目录下有个 BundleConfig.cs 文件

其中包含了一个 注册捆绑文件的函数 (RegisterBundles)

其作用是用来将前端的 JavaScript 和 CSS 做捆绑

只用一条引用命令就可以将一批 Js 和 Css 文件引用到页面上

 

其中

bundles.Add(new ScriptBundle("~/bundles/my").Include(
                      "~/Scripts/*.js"));
bundles.Add(new StyleBundle("~/Content/css").Include(
                      "~/Content/*.css"));

 

SciprtBundle 和 StyleBundle 分别是 JS 和 CSS 捆绑的对应类

"~/bundles/my" 是我们自己指定的一个捆绑路径, 相当于一个指定名称, 不需要实际存在的路径

Include 下的 文件都是实际的 Js 和 Css 存放的相对路径, 可以使用 *, {version} 等通配符来模糊匹配一类的文件

 

在之类注册完 Bundle 之后 只要在前端页面上引用

@Styles.Render("~/Content/css")
@Scripts.Render("~/bundles/my")

就可以达到引用整批 Js 和 Css 文件的目的

这样的好处是.

即使以后在某个 Js,Css 目录下有新增什么同类型的文件的话, 不需要更新引用就可以使用新的文件

简化了更新 Js Css 文件的操作

 

----------------------------------------------------

另外 MVC4 之后微软提供了 自动压缩 JS 和 CSS 文件的办法

只要在 Application_Start() 的方法中使用 

BundleTable.EnableOptimizations = true; 即可

protected void Application_Start()
{
    AreaRegistration.RegisterAllAreas();
    FilterConfig.RegisterGlobalFilters(GlobalFilters.Filters);
    RouteConfig.RegisterRoutes(RouteTable.Routes);
    BundleConfig.RegisterBundles(BundleTable.Bundles);
    BundleTable.EnableOptimizations = true;
}

这样一来 我们前端运行出来的页面上 打开源代码工具看到的就是

 

这样 Js 文件和 Css 文件就自动压缩了