新建一个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. 
						
  2. 跟我一起学习ASP.NET 4.5 MVC4.0（六）（转）
		
    这一系列文章跨度有点大,由于最近忙于其他事情,没有更新,今天重新安装了下Win8系统,VS2012和SQLServer 2012,顺便抽空继续一篇.随着VS2012 RC版本的放出,ASP.NET M ...
    
		
    3. 
						
  3. ASP.NET MVC框架开发系列教程
		
    本系列教程是自己在工作中使用到而记录的,如有错误之处,请给与指正 文章目录 MVC4 开篇 第一章 初识MVC4 第二章 下山遇虎(@helper) 第三章 Models模块属性详解 第四章 在MVC ...
    
		
    4. 
						
  4. System.Web.Optimization对脚本和样式表的操作
		
    这个也是本章重点向描述的部分,首先我们可以使用VS2012RC来新建一个MVC4.0项目,版本可以为4.0或4.5.在Global.asax文件代码中,我们发现已经把过滤器,路由器,以及对样式表和脚本 ...
    
		
    5. 
						
  5. asp.net mvc Bundle
		
    在使用ASP.NET MVC4中使用BundleConfig 将 js css文件 合并压缩使用,但是文件名含有min及特殊字符的将不引用 ,也不提示其他信息.
    
		
    6. 
						
  6. ASP.NET MVC4中的App_start中BundleConfig的介绍使用
		
    在BundleConfig.cs中,指定CSS和JS,主要用来压缩JS和CSS   在ASP.NET MVC4中(在WebForm中应该也有),有一个叫做Bundle的东西,它用来将js和css进行压 ...
    
		
    7. 
						
  7. Oracle+FluentData+MVC4+EasyUI开发权限管理系统之开篇
		
    在园子里有很多EF+MVC+EasyUI的框架实在是太多了,经过在一段时间的学习高手写的思路,但是都是针对Sql数据的,但是今年我当上研发组组长的第一个任务就是编写一个通用平台框架,一刚开始想把学习过 ...
    
		
    8. 
						
  8. ASP.NET MVC4.0+EF+LINQ+bui+bootstrap+网站+角色权限管理系统（开篇）
		
    系统预览: 源码下载:http://www.yealuo.com/Home/Detail?KeyValue=2f926407-f80b-4bff-a729-949a53efed7b 创建项目,新手按步 ...
    
		
    9. 
						
  9. 21、ASP.NET MVC入门到精通——ASP.NET MVC4优化
		
    本系列目录:ASP.NET MVC4入门到精通系列目录汇总 删除无用的视图引擎 默认情况下,ASP.NET MVCE同时支持WebForm和Razor引擎,而我们通常在同一个项目中只用到了一种视图引擎 ...
    
		
    10. 
		

	


随机推荐
	

    
									
  1. Rhythmk 一步一步学 JAVA (18)  Axis2 创建 WebService
			
    一 > 环境配置 1.下载Axis2: 目前版本为 1.6.2 下载地址: http://axis.apache.org/axis2/java/core/ 下载 axis2-1.6.2-bin. ...
    
			
    2. 
						
  2. Maven使用Nexus私服的配置
			
    工作记录 —————————————————————————————— 配置文件 apache-maven-3.3.3\conf\settings.xml 在mirrors(镜像)之间配置. url为 ...
    
			
    3. 
						
  3. 【原】Coursera—Andrew Ng机器学习—编程作业 Programming Exercise 4—反向传播神经网络
			
    课程笔记 Coursera—Andrew Ng机器学习—课程笔记 Lecture 9_Neural Networks learning 作业说明 Exercise 4,Week 5,实现反向传播 ba ...
    
			
    4. 
						
  4. Sqlserver中查找包含某一列的所有的表
			
    select cols.name,cols.id,objs.name,objs.id from syscolumns cols INNER JOIN sysobjects objs on cols.i ...
    
			
    5. 
						
  5. 前端开发之CSS篇二
			
    主要内容: 一.CSS的继承性和层叠性 二.盒模型 三.padding属性 四.border属性 五.margin属性 六.标准文档流 七.行内元素和块状元素转换 1️⃣  CSS的继承性和层叠性 1 ...
    
			
    6. 
						
  6. linux：alias
			
    linux系统下常用一个“命令”ll,它实质上是一个别名,而非命令. 我们用它的前提是,在~/.bashrc文件里打开,默认有条记录: #alias ll=’ls -l’ 这就是别名的格式.把注释去掉 ...
    
			
    7. 
						
  7. js的事件冒泡和点击其他区域隐藏弹出层
			
    一.前言 在编写页面的时候,我们经常使用到弹出层.对于弹出层,原本的意义就是增加与用户的交互,提升用户的好感度.如果弹出层都没有较好的体验,那何谈通过交互来提升好感... 首先提出几个弹出层的注意点: ...
    
			
    8. 
						
  8. css的优先级和权重问题 以及!important优先级
			
    一,前言: 刚加的css怎么没有渲染出来?浏览器中查看,发现是被其他的css给覆盖了,相信我们都曾遇到过这样的问题.那么浏览器是如何选择css标签的渲染顺序的呢?换句话说,css选择器的优先级是怎么规 ...
    
			
    9. 
						
  9. Linux分区挂载点介绍
			
    一.Linux分区挂载点介绍 Linux分区挂载点介绍,推荐容量仅供参考不是绝对,跟各系统用途以及硬盘空间配额等因素实际调整: 分区类型 介绍 备注 /boot 启动分区 一般设置100M-200M, ...
    
			
    10. 
						
  10. Qt webkitwidgets模块和webenginewidgets模块
			
    问题 将Qt开发的程序从Qt5.5或更低的版本迁移到5.6或更高的版本时,会提示webkitwidgets是unknown module. Project ERROR: Unknown module( ...
    
			
    11.