优点:修改js或css时会自动生成hash版本号。

缺点:需要在BundleConfig中先添加对应的文件,然后在html中再引用对应的bundle,多操作了一步。

web.config中 <compilation debug="true" targetFramework="4.5" />

Install-Package Microsoft.AspNet.Web.Optimization

1、BundleConfig

  如果是调试模式,前端页面会显示真实的js、css路径,生产环境是会显示前面的路径。在bundles中还可以使用通配符引用。路径必须要使用~/的方式,不能用/

 bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
"~/Scripts/jquery-{version}.js")); bundles.Add(new ScriptBundle("~/bundles/jqueryval").Include(
"~/Scripts/jquery.validate*"));
 bundles.Add(new ScriptBundle("~/bundles/bootstrap").Include(
"~/Scripts/bootstrap.js",
"~/Scripts/respond.js")); bundles.Add(new StyleBundle("~/Content/css").Include(
"~/Content/bootstrap.css",
"~/Content/site.css"));

2、前端页面

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

3、Global文件中

  要在Application_Start事件中注册Bundles。

BundleConfig.RegisterBundles(BundleTable.Bundles);

4、说明

  只有在生产环境,修改js、css文件才会生成版本哈希值。

  在生产环境,使用bundles的方式会自动引用压缩版min文件。

5、截图说明

  调试模式

  生产环境

MVC-采用Bundles方式引入css和js文件的更多相关文章

  1. Thymeleaf模版--子页面单独引入CSS、JS文件

    https://blog.csdn.net/u010392801/article/details/80465800 ****************************************** ...

  2. 使用时间戳引入css、js文件

    前言 最近在一家创业公司实习,主要负责新版官网和商家平台管理系统的前端开发和维护,每次测试都要上传文件到ftp服务器端测试,初期由于更新修改比较频繁,每次都是直接上传覆盖css.js.php文件,链接 ...

  3. 在VIEW引入CSS、JS文件

    外联 CSS: <?= Html::cssFile('@web/css/ie5.css', ['condition' => 'IE 5']) ?> generates <!-- ...

  4. Django2.0引入css、js、img文件

    Django2.0引入css.js.img文件 一.文件结构 二.settings.py的配置 # Static files (CSS, JavaScript, Images) # https://d ...

  5. Tornado引入静态css、js文件

    一.静态路径 template_path=os.path.join(os.path.dirname(__file__), "templates") 这里是设置了模板的路径,放置模板 ...

  6. 在引入的css或者js文件后面加参数的作用

    有时候可能会遇到js或者css文件引用后传递参数: css和js带参数(形如.css?v=与.js?v=) <script type=”text/javascript” src=”jb51.js ...

  7. coding++ :在引入的css或者js文件后面加参数的作用

    前沿: 有些小伙伴们在页面(F12)直接对 JS.CSS 文件进行编辑.或者打断点调试的时候 可能会发现 所有的操作都不生效,为什么? 原因可能存在以下情况 有时候可能会遇到js或者css文件引用后传 ...

  8. CI框架引入外部css和js文件

    首先在项目根目录下建立assets文件夹,在这个文件夹下再建立css和js文件夹分别放置css和js文件 然后,在项目根目录下建立.htaccess文件 内容如下: RewriteEngine on  ...

  9. IE浏览器没有加载CSS或js文件的秘密及解决办法

    其实是两处资料拼成这一篇博文的,因为在开发过程中遇到,有的文章只是说明原因,而没有给出解决方案,所以再次给出解释和解决方法,以供参考,如果有好的解决方法,也请分享下! ---------------- ...

随机推荐

  1. python实战GUI界面+mysql

    前言 前面用tkinter做了一个巨丑的GUI界面,今天想把它变漂亮起来,重新找回page做了一个界面,它也是基于tkinter开发的所见即所得的界面编辑器,前面因为代码搞不明白没用上,现在重新研究一 ...

  2. Python input用户交互

    1.input(),阻塞等待用户输入内容并敲回车. 1 #-*- encoding:utf-8 -*- 2 3 name = input('请输入你的名字') 4 5 age = input('请输入 ...

  3. 用Python写一个病毒

    WARNING 本文仅供学习和测试,请勿用于非法用途. 前言 花了挺长时间去开发的,中间有很多包是抄的,比如DDL注入.关于opencv等等,主要其实做了一些拼接.打包.部署. 写这篇博客并不真的想去 ...

  4. 循序渐进VUE+Element 前端应用开发(28)--- 附件内容的管理

    在我们很多模块里面,都需要使用到一些诸如图片.Excel文件.PDF文件等附件的管理,一般我们倾向于把它独立为一个公用的附件管理模块,这样可以有效的统一管理附件的信息.本篇随笔介绍附件内容的管理,包括 ...

  5. 用Camtasia来快速给录制的视频添加水印

    在日常生活中,视频的流行度越来越高,各种短视频的软件蜂拥上市,所以越来越多的人走上了自媒体的道路,在这条路上,谁的视频更加的精致,谁才能获得更多的关注度,相应的也能增加自己的人气. 但是在制作视频的过 ...

  6. css3系列之text-shadow 浮雕效果,镂空效果,荧光效果,遮罩效果

    text-shadow 其实这东西,跟  box-shadow 差不多,没啥好说的不懂的话,点这里→  css3系列之详解box-shadow  . 它只有 四个参数 x(第一个值设置x位置) y(第 ...

  7. git操作之四:git branch(本地仓库)

    前面,介绍了git init/add/commit/restore/reset等git命令,今天介绍下git branch,这个命令是和分支相关的.首先要理解什么是分支,简单来说在协作开发中,每个人开 ...

  8. gitlab private-token利用工具

    在渗透测试中,经常会遇到只获得gitlab PRIVATE-TOKEN的情况,而gitlab提供了一系列的api给我们通过这个token去访问gitlab. 所以做了个简单的gitlab工具,以供紧获 ...

  9. Jmeter(二十八) - 从入门到精通 - Jmeter Http协议录制脚本工具-Badboy1(详解教程)

    1.简介 在使用jmeter自动录制脚本时会产生很多无用的请求,所以推荐使用badboy录制脚本之后保存为jmx文件,在jmeter中打开使用.因此宏哥在这里介绍一下Badboy这款工具,本来打算不做 ...

  10. jmeter录制请求

    用了一段时间的jmeter感觉比LR方便很多,界面也比较简洁,开源免费,配置环境也方便,LR简直没法比,但唯一的是功能没有LR强大,毕竟是免费的,要求别那么高. 下面开始进入正题,配置环境和下载就不多 ...