本文参考:http://www.cnblogs.com/willick/p/3438272.html

1、捆绑(Bundle),一个在 View 和 Layout 中用于组织优化浏览器请求的 CSS 和 JavaScript 文件的技术。

2、当我们创建一个MVC工程时,VS在Scripts文件夹下默认引入了以下js:

  • jquery-1.8.2.js,这个就不用解释了。
  • jquery-ui-1.8.24.js,在jQuery 基础上的一套界面工具,包括了网页上常见的很多插件和动画特效。
  • jquery.validate.js,用于验证用户在表单内input元素输入的数据。
  • knockout-2.2.0.js,是一个轻量级的UI类库,通过应用MVVM模式使JavaScript前端UI简单化。
  • modernizr-2.6.2.js,一个开源的JS库,它使得那些基于访客浏览器的不同(指对新标准支持性的差异)而开发不同级别体验的设计师的工作变得更为简单。它使得设计师可以在支持HTML5和CSS3的浏览器中充分利用HTML5和CSS3的特性进行开发,同时又不会牺牲其他不支持这些新技术的浏览器的控制。
  • jquery.unobtrusive-ajax.js,MVC 框架中使用 Unobtrusive Ajax 的库。
  • jquery.validate.unobtrusive.js,基于 jquery.unobtrusive-ajax.js。
  • _references.js,它的作用是通过下面这种方式放入该文件中的JS文件可以被VS智能感知:
/// <reference path="jquery-1.7.1.js" />
/// <reference path="jquery-ui-1.8.20.js" />
/// <reference path="jquery.validate.js" />
/// <reference path="jquery.validate.unobtrusive.js" />
/// <reference path="knockout-2.1.0.debug.js" />
/// <reference path="modernizr-2.5.3.js" />

2、“捆绑”作用是把一类脚本或样式文件捆绑在一起,在需要用的时候调用一句代码就行,极大地方便了脚本和样式文件的管理;而且可以把脚本的普通和 min 两个版本都捆绑起来,MVC也会根据是否为Debug模式智能地选择脚本文件的版本。

3、使用Bundle的方便之一:可以在 /App_Start/BundleConfig.cs 中通过注册来统一管理脚本和样式文件。

public class BundleConfig {
//RegisterBundles 参数对象的 Add 方法添加,该方法的参数需要一个ScriptBundle 类 或 StyleBundle 类的实例对象。
//脚本文件用的是 ScriptBundle 类,样式文件用的是 StyleBundle 类,它们的构造参数代表着捆绑在一起的文件的引用。
//Include 方法用于包含具体要捆绑的文件。其中的 {version} 是文件版本的占位符,MVC会在相应的目录下定位到最新的一个版本文件。
public static void RegisterBundles(BundleCollection bundles) {
bundles.Add(new StyleBundle("~/Content/css").Include("~/Content/*.css")); bundles.Add(new ScriptBundle("~/bundles/clientfeaturesscripts").Include(
"~/Scripts/jquery-{version}.js",
"~/Scripts/jquery.validate.js",
"~/Scripts/jquery.validate.unobtrusive.js",
"~/Scripts/jquery.unobtrusive-ajax.js"));
}
}

方便之二:不用引入一大坨js、css文件,而是通过下列优雅的方式进行:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width" />
<title>@ViewBag.Title</title>
@Styles.Render("~/Content/css")
</head>
<body>
@Scripts.Render("~/bundles/clientfeaturesscripts")
@RenderBody()
</body>
</html>

方便之三:减少带宽并使捆绑请求的链接减少。在发布模式下,响应客户端请求时,MVC整合并最小化了JavaScript文件和样式文件,并使得一个捆绑中的内容在一个请求中加载。

【ASP.NET MVC 学习笔记】- 18 Bundle(捆绑)的更多相关文章

  1. ASP.NET MVC 学习笔记-2.Razor语法 ASP.NET MVC 学习笔记-1.ASP.NET MVC 基础 反射的具体应用 策略模式的具体应用 责任链模式的具体应用 ServiceStack.Redis订阅发布服务的调用 C#读取XML文件的基类实现

    ASP.NET MVC 学习笔记-2.Razor语法   1.         表达式 表达式必须跟在“@”符号之后, 2.         代码块 代码块必须位于“@{}”中,并且每行代码必须以“: ...

  2. ASP.NET MVC 学习笔记-7.自定义配置信息 ASP.NET MVC 学习笔记-6.异步控制器 ASP.NET MVC 学习笔记-5.Controller与View的数据传递 ASP.NET MVC 学习笔记-4.ASP.NET MVC中Ajax的应用 ASP.NET MVC 学习笔记-3.面向对象设计原则

    ASP.NET MVC 学习笔记-7.自定义配置信息   ASP.NET程序中的web.config文件中,在appSettings这个配置节中能够保存一些配置,比如, 1 <appSettin ...

  3. ASP.NET MVC学习笔记-----Filter2

    ASP.NET MVC学习笔记-----Filter(2) 接上篇ASP.NET MVC学习笔记-----Filter(1) Action Filter Action Filter可以基于任何目的使用 ...

  4. ASP.NET MVC学习笔记-----Filter

    ASP.NET MVC学习笔记-----Filter(1) Filter类型 接口 MVC的默认实现 Description Authorization IAuthorizationFilter Au ...

  5. ASP.NET MVC学习笔记-----Filter(2)

    接上篇ASP.NET MVC学习笔记-----Filter(1) Action Filter Action Filter可以基于任何目的使用,它需要实现IActionFilter接口: public ...

  6. ASP.NET MVC 学习笔记(1)

    从头开始系统地学习ASP.NET MVC 为什么要学习ASP.NET MVC?原因很多,可以先来看一下最早的ASP.NET WebForm的一些缺点: 传说中面试经常要问到的ASP.NET WebFo ...

  7. 【转】ASP.NET MVC学习笔记-Controller的ActionResult

    1. 返回ViewResult public ActionResult Index()   {       ViewData["Message"] = "Welcome ...

  8. ASP.NET MVC学习笔记-----使用自定义的View Engine

    我们都知道在ASP.NET MVC中自带了Razor View Engine,Razor十分的强大,可以满足我们绝大部分的需要.但是ASP.NET MVC的高度可扩展性,使我们可以使用自定义的View ...

  9. ASP.NET MVC学习笔记-----ActionInvoker

    还是这张图: 当ControllerFactory生成Controller实例后,这时就需要使用ActionInvoker来选择调用一个合适的Action执行.ASP.NET MVC提供的基类Cont ...

  10. ASP.NET MVC 学习笔记 1

    1. 什么是ASP.Net MVC ASP.Net MVC是一种开发Web应用程序的工具(is a web application development framework),采用Model-Vie ...

随机推荐

  1. java购物车系统 团队博客

    1. 团队名称.团队成员介绍(需要有照片) 团队名称:一颗LFL 团队成员:廖余俊 计算机工程学院网络工程1512 学号201521123053 方旭 计算机工程学院网络工程1512 学号201521 ...

  2. Could not execute JDBC batch update; SQL [delete from role where roleId=?]; constraint [null]; neste

    今天在写多个删除功能的时候出现了这么一个错误:意思是删除操作的时候,没有找到对应的外键. Cannot delete or update a parent row: a foreign key con ...

  3. 解决Maven管理的项目下"Missing artifact xxx bundle"问题

    例如使用maven编译使用了mina的包的工程,出现如下提示:  [INFO] Scanning for projects... [INFO]                             ...

  4. PolarDB · 新品介绍 · 深入了解阿里云新一代产品 PolarDB

    背景意义 云计算为如今的互联网时代提供了更多的计算能力,乃至创造能力,关系型数据库作为所有应用不可或缺的重要部件,开箱即用,高性价加比特性的云数据库深受开发者的喜爱.作为一线的开发和运维人员,在阿里云 ...

  5. Configuration Extensions - 简化配置,让你配置支持变量

    在开发"RabbitCloud"项目时,使用配置文件发现会有很多重复值,所以我基于"Microsoft.Extensions.Configuration"写了一 ...

  6. overflow使用說明

    必須設置的CSS屬性: { display:block; //或者inline-block,text-overflow:ellipsis只對block或者inline-block有效 white-sp ...

  7. mysql 存储引擎介绍1

    1.1  存储引擎的使用 数据库中的各表均被(在创建表时)指定的存储引擎来处理. 服务器可用的引擎依赖于以下因素: MySQL的版本 服务器在开发时如何被配置 启动选项 为了解当前服务器中有哪些存储引 ...

  8. 第4章 同步控制 Synchronization ----互斥器(Mutexes)

    Win32 的 Mutex 用途和 critical section 非常类似,但是它牺牲速度以增加弹性.或许你已经猜到了,mutex 是 MUTual EXclusion 的缩写.一个时间内只能够有 ...

  9. js中set和get的用法

    get 语句作为函数绑定在对象的属性上,当访问该属性时调用该函数. set 语法可以将一个函数绑定在当前对象的指定属性上,当那个属性被赋值时,你所绑定的函数就会被调用. eg: var log = [ ...

  10. Linux JDK配置

    第一步:下载jdk-7-linux-i586.tar.gz wget -c http://download.oracle.com/otn-pub/java/jdk/7/jdk-7-linux-i586 ...