无论是有asp还是asp.net,还是php做网站经验的都知道当我们需要css或者js文件的时候我们需要在<head></head>标签中间导入我们需要的js或者css文件的路径,如下:

如果对网站没有一个好的规划,或者像我刚开始做网站的时候,必定导入的外来不少文件,导致网站性能下降,不容易管理,而且css冗余的话会出现兼容性问题,比较头疼,MVC这里有了一个不错的改进,那就可以使用bundle把需要的文件绑定起来,在创建的空MVC的App_Start文件下有个BundleConfig.cs文件如图:

这里的bundles.Add(new ScriptBundle("~/bundles/jquery").Include(中主要是来添加一个绑定,绑定的意思就是如果有那么一套js或者css比较常用的话,可以通过一个虚拟路径来绑定那些经常用的文件,以后使用的时候就方便很多,当然还有很多好处,下面讲。new ScriptBundle和new StyleBundle的区别很明显,上面的图片已经标识了出来,分别是用来绑定js和css,能不能混淆的话,我没试过,有兴趣的朋友可以玩下,其中new StyleBundle(“”)两个引号中间的就是你的虚拟路径,后面使用起来你就会明白,其中后面的include加的就是你要导入的文件了,不说大家都懂的。

ps:虚拟路径的名字自己取,但是有一点要注意的就是,不能和物理路径一样,不然会报错,况且MVC已经不和虚拟路径挂钩了,这也是MVC的特色

然后就是在前台页面使用这些文件,需要使用方法如上@Styles.Render")和@Scripts.Render(""),分别是js和css的使用方法,当然,里面引号放的就是你之前绑定的时候用到的虚拟路径名字(如果有两个相同的虚拟路径,MVC会自动寻找第一个相同的路径,并加载你的文件),于是一句简单的代码就把你所有绑定的js和css文件给加载了进来。

当然在使用的时候也是需要注册bundle的使用,在global.cs文件里面注册,默认情况下已经注册使用,如下图:

好,整体的绑定的过程就大概到这里,其实有了什么有点呢,个人觉得

1.可以按照自己的需求定义多套js或者css文件,在必要的时候可以更改

2.浏览器对页面的请求数据只进行一次,而且传送过来的是压缩版的文件,因此性能上提高了不少。默认情况下,这些文件会自动保存在你浏览器的缓存文件,因此多次调用的时候其实只在第一次访问的服务器

MVC bundle(CSS或JS)的更多相关文章

  1. asp.net mvc处理css和js版本问题

    当服务的修改了js和css内容后,发布到IIS服务器上,总是导致客户端内容显示不正确,原因是客户端存在缓存,还是加载的原来的js和css问题. 在css或js后面添加版本号,例如: <scrip ...

  2. mystar01 nodejs MVC 公共CSS,JS设置

    mystar01 nodejs MVC gulp 项目搭建 config/express.js中定义别名 //将下载的第三方库添加到静态资源路径当中,方便访问 app.use('/jquery', e ...

  3. Windows server 2008 IIS7发布asp.net mvc网站css、js脚本无法访问 问题解决

    今天发布网站遇到一个感到很无语的问题,网站发布成功,浏览网站内容数据显示正常,就是没有样式,试了下脚本也是没有反应,如图效果: 接下来就是一顿苦找原因,检查iis设置.什么应用程序池.文件路径等各种检 ...

  4. [Asp.net MVC]Bundle合并,压缩js、css文件

    摘要 在web优化中有一种手段,压缩js,css文件,减少文件大小,合并js,css文件减少请求次数.asp.net mvc中为我们提供一种使用c#代码压缩合并js和css这类静态文件的方法. 一个例 ...

  5. 解决MVC中使用BundleConfig.RegisterBundles引用Css及js文件发布后丢失的问题

    ASP.NET MVC4,ASP.NET MVC5中对JS和CSS的引用又做了一次变化,在MVC3中我们这样引用资源文件: <link href="@Url.Content(" ...

  6. mvc BundleConfig实现对Css、Js压缩打包加载

    Bundle不是.net Framework框架中的一员,使用Bundle首先要先添加引用,如下: nuget包管理--程序包管理控制台--Install-Package Microsoft.AspN ...

  7. ASP.NET MVC 4 RC的JS/CSS打包压缩功能 Scripts.Render和Styles.Render

    打包(Bundling)及压缩(Minification)指的是将多个js文件或css文件打包成单一文件并压缩的做法,如此可减少浏览器需下载多个文件案才能完成网页显示的延迟感,同时通过移除JS/CSS ...

  8. ASP.NET MVC 4 RC的JS/CSS打包压缩功能 (转载)

    ASP.NET MVC 4 RC的JS/CSS打包压缩功能 打包(Bundling)及压缩(Minification)指的是将多个js文件或css文件打包成单一文件并压缩的做法,如此可减少浏览器需下载 ...

  9. (转)ASP.NET MVC 4 RC的JS/CSS打包压缩功能

    转自:http://www.cnblogs.com/shanyou/archive/2012/06/22/2558580.html 打包(Bundling)及压缩(Minification)指的是将多 ...

随机推荐

  1. [CentOS 7] 安装nginx第一步先搭建nginx服务器环境

    简要地介绍一下,如何在CentOS 7中安装nginx服务器 方法/步骤   下载对应当前系统版本的nginx包(package) # wget  http://nginx.org/packages/ ...

  2. MVC中的奇葩错误,参数转对象

    在使用MVC中遇到一个神奇的错误,特此记录(我在用MVC4时遇到) 上面两张图就是一个变量名进行了修改,其他不变!form里面的参数也是一样的!喜欢尝试的可以尝试一下! 我的变量使用action时出现 ...

  3. SQL基础篇----select语句与排序问题

    一.检索--输出所有的列 SELECT * FROM my_friends WHEREfirst_name = 'cake'; 知识点1 * 代表选择出所有的行-----(什么行呢?)就是first_ ...

  4. Spring组件扫描<context:component-scan/>使用详解

    1.如果不想在xml文件中配置bean,我们可以给我们的类加上spring组件注解,只需再配置下spring的扫描器就可以实现bean的自动载入. <!-- 注解注入 --> <co ...

  5. TAT 前端突击队 第四关 题目 腐蚀的画

    腐蚀的画 1.一个漂亮的画作在经过几千年岁月的洗礼下,部分地方已经被腐蚀了,像一个孤独的老人,满脸爬满了皱纹.2.但在一个晚上,老王突然发现,这些腐蚀的部分中,隐藏着岁月留下的密秘.请你帮助老王寻找这 ...

  6. WIFI 物理组件

    物理组件参考:http://book.51cto.com/art/201404/435813.htm SDIO总线参考:此总线sd卡连接也有关系.(http://www.linuxidc.com/Li ...

  7. Linux开机启动程序详解

    Linux开机启动程序详解我们假设大家已经熟悉其它操作系统的引导过程,了解硬件的自检引导步骤,就只从Linux操作系统的引导加载程序(对个人电脑而言通常是LILO)开始,介绍Linux开机引导的步骤. ...

  8. Swift global function(count indexOfObject contains...)

    当你在使用Swift时会发现一些常用的函数不!见!了! 比如 String:    s.count()  s.contains() Array: a.indexOfObeject(t:<T> ...

  9. Jquery Mobile局部刷新后js和css失效,需局部渲染

    $(function () {    $("#submit").click(function(){      var storage = window.localStorage;  ...

  10. Querying mergeinfo requires version 3 of the FSFS filesystem schema

    环境: jdk 1.7; svn  3.0.4;  TortoiseSVN 1.7.13 Subversion 1.7.10; IntelliJ IDEA 13.1.1;win7 64位系统 之前那个 ...