ASP.NETMVC4捆绑和缩小实例介绍

   2015-07-22 0
核心提示:在 ASP.NET MVC 4 中可捆绑多个 css 和 js 文件以减少HTTP请求,并对 css 和 js 文件进行压缩(缩小),这样可提高网站的加载速度
在 ASP.NET MVC 4 中可捆绑多个 css 和 js 文件以减少HTTP请求,并对 css 和 js 文件进行压缩(缩小),这样可提高网站的加载速度。我们选取博客园的 css 文件来看看,在 ASP.NET MVC 4 前,我们引入 css 方法如下:

复制代码 代码如下:

<link href="/Content/Site.css" rel="stylesheet" type="text/css" />
<link href="/Content/sitehome.css" rel="stylesheet" type="text/css" />

在 IE 中使用 F12 查看结果,如图:


ASP.NETMVC4捆绑和缩小实例介绍

在 ASP.NET MVC 4 中,使用下边写法引入 css 文件:

<link href="/Content/css" rel="stylesheet" />

重新运行,结果如下:


ASP.NETMVC4捆绑和缩小实例介绍


可以清楚的看到,在 ASP.NET MVC 4 中使用新方法引入 css 时,网站运行时不仅合并了 css 文件而且压缩了 css 中的代码。双击 css 文件,在响应正文中可以看到:

ASP.NETMVC4捆绑和缩小实例介绍

对 js 文件的处理方式同 css 相同,引入方法如下:

复制代码 代码如下:

<script src="/Scripts/js"></script>


ASP.NET MVC 4 中捆绑时,css 排序规则为:先加载 reset.css、normalize.css,其他文件按首字母排序,类似地 js 排序规则为 jquery.js、jquery-ui.js 其他文件同样按首字母排序。有时我们需要在不同页面加载不同的 css 或 js 文件,以减少不必要的文件,下边就让我们看看怎么自定义一个捆绑。

在 Global.asax.cs 文件 Application_Start() 中添加如下代码:

复制代码 代码如下:

//定义名为"mycss"的捆绑,js对应为 new JsMinify()
var b = new Bundle("~/mycss", new CssMinify());
//添加Content文件夹下的所有css文件到捆绑
//第三个参数false表示,Content文件夹下的子文件夹下不添加到捆绑
b.AddDirectory("~/Content", "*.css", false);
//添加到BundleTable
BundleTable.Bundles.Add(b);


这样在需要使用的页面,加入下边的代码即可:

复制代码 代码如下:

<link href="/mycss" rel="Stylesheet" />


总结:ASP.NET MVC 4 捆绑和缩小功能,使得减少 http 请求和压缩 js、css 文件变得非常简单,这样不需要我们手动来合并 js、css 文件,也不需要使用工具来压缩这些文件,使得 js、css 文件的管理变得简单,易于维护,从而将我们从重复的工作中解脱出来。

作者:东奎
 
标签: ASP.NET MVC 捆绑
反对 0举报 0 评论 0
 

免责声明:本文仅代表作者个人观点,与乐学笔记(本网)无关。其原创性以及文中陈述文字和内容未经本站证实,对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺,请读者仅作参考,并请自行核实相关内容。
    本网站有部分内容均转载自其它媒体,转载目的在于传递更多信息,并不代表本网赞同其观点和对其真实性负责,若因作品内容、知识产权、版权和其他问题,请及时提供相关证明等材料并与我们留言联系,本网站将在规定时间内给予删除等相关处理.

  • [VB][ASP.NET]FileUpload控件「批次上传 / 多档
    FileUpload控件「批次上传 / 多档案同时上传」的范例 (VB语法) http://www.dotblogs.com.tw/mis2000lab/archive/2008/05/14/3986.aspx    FileUpload控件真的简单好用,不使用它来作批次上传,却要改用别的方法,实在不聪明。要用就一次用到底,公开File
    02-10
  • 使用WebClient自动填写并提交ASP.NET页面表单的源代码
    使用WebClient自动填写并提交ASP.NET页面表单的
    转自:http://www.cnblogs.com/anjou/archive/2007/03/07/667253.html 在.NET中通过程序填写和提交表单还是比较简单。比如,要提交一个如下图所示的登录表单:           填写和提交以上表单的代码如下:       // 要提交表单的URI字符串
    02-09
  • asp.net mvc多条件+分页查询解决方案
    


            
asp.net mvc多条件+分页查询解决方案
    asp.net mvc多条件+分页查询解决方案
    http://www.cnblogs.com/nickppa/p/3232535.html开发环境vs2010css:bootstrapjs:jquery    bootstrap paginator原先只是想做个mvc的分页,但是一般的数据展现都需要检索条件,而且是多个条件,所以就变成了MVC多条件+分页查询因为美工不是很好,所以用的是
    02-09
  • ASP.NET操作Cookies的问题(Bug or Not)
    以下存和取都是在不同的页面中,如果是在同一个页面也没必要用cookies了。 Test1: 给Cookies赋值: const string AAA="aaa"; Response.Cookies[AAA].Value = "111;222;333"; 取值: string value = Request.Cookies[AAA].Value; // value为111 Test2: 给Cooki
    02-09
  • Asp.Net Core 自定义验证属性
      很多时候,在模型上的验证需要自己定义一些特定于我们需求的验证属性。所以这一篇我们就来介绍一下怎么自定义验证属性。  我们来实现一个验证邮箱域名的自定义验证属性,当然,最重要的是需要定义一个继承自ValidationAttribute的类,然后在实现其IsVal
    02-09
  • Asp.Net 之 枚举类型的下拉列表绑定
    有这样一个学科枚举类型:/// 学科 /// /summary public enum Subject {None = 0,[Description("语文")]Chinese = 1,[Description("数学")]Mathematics = 2,[Description("英语")]English = 3,[Description("政治")]Politics = 4,[Description("物理&qu
    02-09
  • [ASP.NET笔记] 1.Web基础知识
         1:http协议:     2:web服务器:     3:静态网页的概念     4:动态网页的概念       http协议:http(hypertext transfer protocol) 即超文本传输协议,这个协议是在internet上进行信息传送的协议任何网页之间要相互沟通,必须要尊循
    02-09
  • ASP.NET邮件发送 .net 发送邮件
      今天做了个ASP.NET做发送邮件功能,发现QQ邮箱好奇怪,当你用QQ邮箱做服务器的时候什么邮件都发送不出去(QQ邮箱除外)。而且爆出这样的错误:"邮箱不可用。 服务器响应为: Error: content rejected.http://mail.qq.com/zh_CN/help/content/rejectedmail.ht
    02-09
  • 由ASP.NET Core根据路径下载文件异常引发的探究
    前言    最近在开发新的项目,使用的是ASP.NET Core6.0版本的框架。由于项目中存在文件下载功能,没有使用类似MinIO或OSS之类的分布式文件系统,而是下载本地文件,也就是根据本地文件路径进行下载。这其中遇到了一个问题,是关于如何提供文件路径的,通
    02-09
  • ASP.NET的运行原理与运行机制 ASP.NET的开发模式包括
    ASP.NET的运行原理与运行机制 ASP.NET的开发模
    在Asp.net4和4.5中,新增了WebPages Framework,编写页面代码使用了新的Razor语法,代码更加的简洁和符合Web标准,编写方式更接近于PHP和以前的Asp,和使用WebForms这种模仿Windows Form编程方式有了很大不同,不再有大量控件和控件生成的大量不够灵活的代码
    02-09
点击排行