ASP.NET MVC4中用 BundleCollection

来源:http://www.cnblogs.com/madyina/p/3702314.html

ASP.NET MVC4中对JS和CSS的引用又做了一次变化,在MVC3中我们这样引用资源文件:

<link href="@Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css" />

将在运行的时候自动将虚拟(相对)路径转换为应用程序绝对路径。这是比较传统的引用方式,尽管他做了一次转换操作,对服务器的请求数量压力并没有什么改进的变化,所以推测可能出于模块化设计思想和并发方面的考虑,微软在MVC4中将这一方式做了改变:

在新建一个ASP.NETMVC4站点的时候都会在~/App_Start目录下有一个BundleConfig.cs的启动文件,当然创建其他的ASP.NET4.0及4.0以上的项目也会有。这个文件里面包含了如下代码:

 bundles.Add(new ScriptBundle("~/bundles/jqueryval").Include("~/Scripts/jquery.unobtrusive*","~/Scripts/jquery.validate*"));bundles.Add(new StyleBundle("~/Content/css").Include("~/Content/site.css"));

这段代码被放在Application_Start()中执行了:

BundleConfig.RegisterBundles(BundleTable.Bundles);

上述Add方法的含义在于将网站引用资源根据实际情况进行分组引用,然后页面部分按照如下方式来引用:

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

在运行之后会生成常规引用代码,从而达到资源引用的目的。但是这个改进远远没有看起来那么简单,我们先引用《淘宝这十年》中一段话:

生成首页后,对Web前端稍微有点常识的人都应该知道,浏览器下一步会加载页面中用到的CSS、JS(JavaScript)、图片等样式、脚本和资源文件。但是可能相对较少的人才会知道,你的浏览器在同一个域名下并发加载的资源数量是有限的,例如IE 6和IE 7是两个,IE 8是6个,chrome各版本不大一样,一般是4~6个。我刚刚看了一下,我访问淘宝网首页需要加载126个资源,那么如此小的并发连接数自然会加载很久。

我们只需要将BundleTable.EnableOptimizations设置为true,MVC4就会启用压缩,将单次引用的资源文件压缩,减少请求数量和带宽,当然在开发调试时一般不开启。

那么会遇到什么问题呢?

1. 自定义的JS不一定能成功加载。

    我们一般习惯于将JS和CSS放置在一个大目录中,因为有些时候他们是分不开的(项目规模大了除外),比如我是将EasyUI的目录结构原原本本的放在Content目录下,那么删除掉Scripts目录和BundleConfig.cs中无关引用,添加自己的如下:

 bundles.Add(new ScriptBundle("~/bundles/jquery").Include("~/Content/jquery.min.js"));bundles.Add(new ScriptBundle("~/bundles/easyui").Include( "~/Content/jquery.easyui.min.js"));

页面中按照上面的方式引用,结果发现根本没有引用到,于是注意到MVC在设计这里的功能的时候引入了通配符,比如

bundles.Add(new ScriptBundle("~/bundles/jquery").Include("~/Scripts/jquery-{version}.js"));bundles.Add(new ScriptBundle("~/bundles/jqueryval").Include( "~/Scripts/jquery.unobtrusive*", "~/Scripts/jquery.validate*"));

可以通过版本匹配,也可以通过*号匹配但是必须放在最后,没有提会忽略哪些字符串,所以导致了上述问题。

解决方案是去掉min即可。

2.css被压缩后,里面图片路径文件的问题。

样式表中Content/themes/styles.css 里图片一般都是这样写的 background: url(img/bg.png),在启用了压缩之后路径就会改变,所以路径全部出现找不到资源的情况。

解决方案:对于独立的CSS单独分组如:

bundles.Add(new StyleBundle("~/Content/css").Include("~/Content/site.css"));

暂时发现这2个问题,MSDN居然没有做说明,特此记录!

转载于:https://www.cnblogs.com/chengjun/p/4185278.html

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/574982.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

java数组对角线的和_java – 2d数组对角线填充

那么&#xff0c;如果你要枚举这些填充模式的索引&#xff0c;你会得到0,01,00,12,01,10,22,11,22,2所以&#xff0c;你需要遍历两个指标的总和。也就是说&#xff0c;总添加量。如您所见&#xff0c;0,0总计0&#xff0c;1,0和0,1总计1&#xff0c;依此类推。给我们这样的东西…

python如何下载安装spacy_使用pip安装Spacy时出错

它可能与虚拟环境(venv)中安装的其他python包发生冲突。我就是这样。我尝试将pip安装到已经安装了以下软件包的venv中&#xff1a;appnope0.1.0beautifulsoup44.5.1bs40.0.1chardet2.3.0cloudpickle0.2.1cssselect1.0.0cymem1.31.2decorator4.0.10entrypoints0.2.2headers-work…

入门monkeyrunner7-monkeyrunner demo3 EasyMonkeyDevice+hierarchyviewer +monkeyrunner+截图对比

1 #该demo为monkeyrunner测试安卓系统自带的计计算器2 #测试图片对比&#xff0c;测试EasyMonkeyDevice对象&#xff0c;一些他的元素操作3 #作者&#xff1a;Mads Spiral QQ&#xff1a;79523822 如有疑问留言或者加qq&#xff0c;验证wyx4 #codingutf-85 import sys6 import …

小程序向java后台发送图片_微信小程序在后台如何将二进制流转换成图片

我在前端请求了小程序码返回的是一堆乱码&#xff0c;java不太熟网上找了一个方法可以将二进制流和图片互转&#xff0c;但是从微信小程序码接口获取的数据用这个方法无法获取正确的图片&#xff0c;不知道哪里有问题&#xff1b;有没有只在前端就能获取小程序码的方法RequestM…

python end of statement_17个新手常见Python运行时错误

12) Trying to use a Python keyword for a variable name. (Causes “SyntaxError: invalid syntax”)The Python keywords (also called reserved words) cannot be used for variable names. This happens with code like:class algebraThe Python 3 keywords are: and, as…

Android Fragment功能的例子

实现的功能很简单&#xff0c;也是最基本的&#xff0c;上下分别是两个Fragment&#xff0c;上面的Fragment中是一个listview&#xff0c;当点击item时&#xff0c;下面的Fragment显示对应的文字详细信息 具体的实现步骤如下&#xff1a;①创建工程FragmentExam&#xff0c;目录…

java上传图片http错误_上传图片出错

源码&#xff1a;package action;import java.io.IOException;import com.qiniu.common.QiniuException;import com.qiniu.http.Client;import com.qiniu.http.Response;import com.qiniu.storage.UploadManager;import com.qiniu.util.Auth;public class UploadAction {public…

template标签_C++核心准则T.65:使用标签分发提供函数的不同实现

T.65: Use tag dispatch to provide alternative implementations of a functionT.65:使用标签分发提供函数的不同实现Reason(原因)A template defines a general interface.模板定义普遍接口。Tag dispatch allows us to select implementations based on specific properties…

Windows服务器学习篇:服务器连接与退出

此文是我早期在公司内部发布的一篇给予新入职程序员基础技术培训的文章&#xff0c;非常基础简单&#xff0c;现拿出来给大家分享。当然&#xff0c;已工作人士可直接忽略... 一、Windows服务器连接 1. 在桌面菜单中的“运行”里&#xff0c;输入mstsc命令&#xff0c;然后回车…

nginx动静分离配置_Nginx动静分离

动静分离动静分离&#xff0c;就是将JSP、Servlet等动态资源交由Tomcat或其他Web服务器处理&#xff0c;将CSS、js、image等静态资源交由Nginx或其他Http服务器处理&#xff0c;充分发挥各自的优势&#xff0c;减轻其他服务器的压力&#xff0c;搭建更为高效的系统架构。Nginx动…

用java自动化访问百度测试_java+eclipse+selenium+百度搜索设置自动化测试

在eclipse中新建一个项目baidutest&#xff1b;再在src文件夹中新建一个包com.baidutest.homework&#xff1b;再在包中新建一个java类baidusetting&#xff0c;并设置为静态类&#xff1b;最后在项目中新建一个lib文件夹&#xff0c;将selenium的所有架包拷贝到lib文件夹中&am…

内存泄漏以及常见的解决方法

之所以撰写这篇文章是由于前段时间花费了非常大的精力在已经成熟的代码上再去处理memory leak问题。写此的目的是希望我们应该养成良好的编码习惯&#xff0c;尽可能的避免这种问题&#xff0c;由于当你对着一大片的代码再去处理此类的问题&#xff0c;此时无疑添加了解决的成本…

python爬取网易云音乐飙升榜音乐_python爬取网易云音乐热歌榜实例代码

首先找到要下载的歌曲排行榜的链接&#xff0c;这里用的是&#xff1a;https://music.163.com/discover/toplist?id3778678然后更改你要保存的目录&#xff0c;目录要先建立好文件夹&#xff0c;例如我的是保存在D盘-360下载-网易云热歌榜文件夹内&#xff0c;就可以完成下载。…

java thread 名称_Thread类常用方法之设置线程名称

package com.itheima.demo02.setName;/*设置线程的名称:(了解)1.使用Thread类中的方法setName(名字)void setName(String name) 改变线程名称&#xff0c;使之与参数 name 相同。2.创建一个带参数的构造方法,参数传递线程的名称;调用父类的带参构造方法,把线程名称传递给父类,让…

HDU 1108 最小公倍数

最小公倍数 Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Others) Total Submission(s): 32794 Accepted Submission(s): 18303Problem Description给定两个正整数&#xff0c;计算这两个数的最小公倍数。Input输入包括多组測试数据&#…

Java为xml跟节点添加子节点_如何将xml节点作为第一个子节点插入Java中的另一个xml文档中?...

小编典典如果事实证明我只是为您做功课&#xff0c;我会感到非常恼火。package com.akonizo.examples;import java.io.ByteArrayInputStream;import java.io.StringWriter;import javax.xml.parsers.DocumentBuilder;import javax.xml.parsers.DocumentBuilderFactory;import j…

成员变量和局部变量的区别_Java 变量类型

点击上方“蓝字”带你去看小星星今天主要学习Java变量类型&#xff0c;主要是局部变量、实例变量和类变量(静态变量)。Java语言中&#xff0c;所有的变量在使用前必须声明。声明变量的基本格式如下&#xff1a;type identifier [ value][, identifier [ value] ...] ;格式说明…

java gson序列化_java – Gson多态序列化

使用Gson 2.2.2我正在尝试序列化POJO(行为)的数组列表.我有一个适配器几乎是我在网上看到的副本&#xff1a;public class BehaviorAdapter implements JsonSerializer {private static final String CLASSNAME "CLASSNAME";private static final String INSTANCE …

【云图】如何制作附近实体店的地图?-微信微博支付宝

【云图】如何制作附近实体店的地图&#xff1f;-微信微博支付宝 原文:【云图】如何制作附近实体店的地图&#xff1f;-微信微博支付宝 摘要&#xff1a; 附近连锁店地图与全国连锁店地图&#xff0c;最大的区别就是&#xff1a; 1、附近连锁店地图需要先定位&#xff0c;然后搜…

php curl跨域cookie_PHP curl模拟文件上传(接口请求实现跨域文件中转)

3e2f08c0c11a8416dd107bbfc9159718.jpg客户端代码请求参数参数类型参数说明$urlstringpost提交的服务器url路径$data数组表单数据$files数组表单文件public function curl_custon_postfields($url, array $data array(), array $files array()){$curlfiles array();foreach …