新建一个mvc4默认项目,会看到以下目录

打开App_start 里面BundleConfig.cs文件

你会看到这么一段话:

有关 Bundling 的详细信息,请访问 http://go.microsoft.com/fwlink/?LinkId=254725

我现在讲的东西跟上面网址所说大同小异,不同网址里面是英文版

我这里讲的一些简单点

Bundling 这个英文从字面意思来说是:捆绑意思。。。

从程序层面来说:就是将所有文件捆绑在一起,然后压缩成一个文件

Demo就不使用官方,我手动建一个,估计大家会看明白点

1、在BundleConfig.cs加入以下2段话

 bundles.Add(new StyleBundle("~/test/style").Include(
"~/Content/a.css",
"~/Content/b.css"));

注意:~/test/style这个可以理解虚拟文件夹,实际上是不存在,但它里面包括2个文件

~/Content/a.css 和 ~/Content/b.css

2、 在a.css加入以下内容,没有实际意义,为了测试

.a_test_style {
font-size:12px;
}

在b.css加入以下内容,没有实际意义,为了测试

.a_test_style {
font-size:12px;
}

3、在Home文件夹增加Index视图,当然对于controller也要增加 index()方法

参考一下官方调用例子 site.master里面

<%: Styles.Render("~/Content/css") %>
<%: Scripts.Render("~/bundles/modernizr") %>
<%: Styles.Render("~/Content/themes/base/css") %>

测试页面代码很简单

<%@ Page Language="C#" Inherits="System.Web.Mvc.ViewPage<dynamic>" %>

<!DOCTYPE html>

<html>
<head runat="server">
<meta name="viewport" content="width=device-width" />
<title>Test</title>
<%:Styles.Render("~/test/style") %>
</head>
<body>
<div>
<p>有钱就是任性</p>
</div>
</body>
</html>

  

调用:<%:Styles.Render("~/test/style") %>

4、生成 运行,看到以下结果

看到2条请求(google浏览器 F12)


当然 这个效果不是我最终所要的..

5、这就要我们合并文件,有2个方法

1、在配置文件Config<compilation debug="true" targetFramework="4.0" />  将debug改为false

2、在BundleConfig.cs加上这段话  BundleTable.EnableOptimizations = true;

将config里面debug=false改一下,运行浏览器试试效果

看到只有一个请求,这是否就是我们所要的的呢?

F12打开谷歌开发工具,response看到 a.css b.css里面文件合并在一起

6、这样子做好处:减少http请求,缩短响应时间,提高网页速度,起到优化网站的作用。当然好处不止这些……

mvc4开篇之BundleConfig(1)的更多相关文章

  1. MVC4 开篇

    开篇,肯定不讲技术. 新项目开工了,用到了MVC4,赶快来园子吐槽下. 刚出来一年,学到了一些东西,但是自知比菜鸟还不如,空闲不看书,不练习demo,快吐我吧... 哈哈,吐吧,哥还是一样淡定,淡定, ...

  2. 跟我一起学习ASP.NET 4.5 MVC4.0(六)(转)

    这一系列文章跨度有点大,由于最近忙于其他事情,没有更新,今天重新安装了下Win8系统,VS2012和SQLServer 2012,顺便抽空继续一篇.随着VS2012 RC版本的放出,ASP.NET M ...

  3. ASP.NET MVC框架开发系列教程

    本系列教程是自己在工作中使用到而记录的,如有错误之处,请给与指正 文章目录 MVC4 开篇 第一章 初识MVC4 第二章 下山遇虎(@helper) 第三章 Models模块属性详解 第四章 在MVC ...

  4. System.Web.Optimization对脚本和样式表的操作

    这个也是本章重点向描述的部分,首先我们可以使用VS2012RC来新建一个MVC4.0项目,版本可以为4.0或4.5.在Global.asax文件代码中,我们发现已经把过滤器,路由器,以及对样式表和脚本 ...

  5. asp.net mvc Bundle

    在使用ASP.NET MVC4中使用BundleConfig 将 js css文件 合并压缩使用,但是文件名含有min及特殊字符的将不引用 ,也不提示其他信息.

  6. ASP.NET MVC4中的App_start中BundleConfig的介绍使用

    在BundleConfig.cs中,指定CSS和JS,主要用来压缩JS和CSS   在ASP.NET MVC4中(在WebForm中应该也有),有一个叫做Bundle的东西,它用来将js和css进行压 ...

  7. Oracle+FluentData+MVC4+EasyUI开发权限管理系统之开篇

    在园子里有很多EF+MVC+EasyUI的框架实在是太多了,经过在一段时间的学习高手写的思路,但是都是针对Sql数据的,但是今年我当上研发组组长的第一个任务就是编写一个通用平台框架,一刚开始想把学习过 ...

  8. ASP.NET MVC4.0+EF+LINQ+bui+bootstrap+网站+角色权限管理系统(开篇)

    系统预览: 源码下载:http://www.yealuo.com/Home/Detail?KeyValue=2f926407-f80b-4bff-a729-949a53efed7b 创建项目,新手按步 ...

  9. 21、ASP.NET MVC入门到精通——ASP.NET MVC4优化

    本系列目录:ASP.NET MVC4入门到精通系列目录汇总 删除无用的视图引擎 默认情况下,ASP.NET MVCE同时支持WebForm和Razor引擎,而我们通常在同一个项目中只用到了一种视图引擎 ...

随机推荐

  1. Vim配置:在win10下用vim编译运行C/C++(异步插件管理,一键运行)

    为什么用Vim 重新调配vim,追求尽量简单些. 安装 官网下载 PC: MS-DOS and MS-Windows下的 For modern MS-Windows systems (starting ...

  2. 2、keys相关命令

    redis的官网http://redis.io是学习redis的重要资源库,所有命令都分门别类的罗列在了这里http://redis.io/commands. 1.数据库选择命令: SELECT in ...

  3. mysql utf8方式连接查看表数据乱码的问题

    起因 今天在公司第一次链接一个新的mysql数据库,我看到在spring里配置的jdbc里datasource.url里有配置characterEncoding=utf8..然后就用navicat开选 ...

  4. python:ord()和chr()——字符串和ASCll编码转换

    ord()函数:字符串——>ascll编码 chr()函数:ascll编码——>字符串 #函数 for i in range(ord('d'),ord('f')+1):#拿到d和f对应的a ...

  5. 团队合作的Ground Rules

    在每个Sprint中,我们会为Sprint的确定DOD(Definition of Done,完成的定义).在团队成员合作的过程中,我们也需要定义合作规则,这就是Ground rules,就像小学生守 ...

  6. java.lang.NoSuchMethodError: org.springframework.dao.IncorrectResultSizeDataAccessException

    spring data jpa  运用,在dao类中写自己新增的方法,使用@query写hql语句,出现以下异常: Caused by: java.lang.NoSuchMethodError: or ...

  7. Excel VBA 获取按钮对象

    今天给同事写了两个VBA宏,并分别把宏赋给了两个按钮. 因为两个宏都是实现在两种显示方式之间切换,于是我想除了功能的实现外,还希望在切换到其中一种方式时,按钮上面的文字也可以跟着改变,起到提示作用. ...

  8. Nginx源码完全注释(3)ngx_list.h / ngx_list.c

    列表头文件ngx_list.h #ifndef _NGX_LIST_H_INCLUDED_ #define _NGX_LIST_H_INCLUDED_ #include <ngx_config. ...

  9. 128. Longest Consecutive Sequence (HashTable)

    Given an unsorted array of integers, find the length of the longest consecutive elements sequence. F ...

  10. JS中的函数声明和函数表达式的区别,即function(){}和var function(){},以及变量提升、作用域和作用域链

    一.前言 Uncaught TypeError: ... is not a function function max(){}表示函数声明,可以放在代码的任何位置,也可以在任何地方成功调用: var ...