MVC-采用Bundles方式引入css和js文件
优点:修改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文件的更多相关文章
- Thymeleaf模版--子页面单独引入CSS、JS文件
https://blog.csdn.net/u010392801/article/details/80465800 ****************************************** ...
- 使用时间戳引入css、js文件
前言 最近在一家创业公司实习,主要负责新版官网和商家平台管理系统的前端开发和维护,每次测试都要上传文件到ftp服务器端测试,初期由于更新修改比较频繁,每次都是直接上传覆盖css.js.php文件,链接 ...
- 在VIEW引入CSS、JS文件
外联 CSS: <?= Html::cssFile('@web/css/ie5.css', ['condition' => 'IE 5']) ?> generates <!-- ...
- Django2.0引入css、js、img文件
Django2.0引入css.js.img文件 一.文件结构 二.settings.py的配置 # Static files (CSS, JavaScript, Images) # https://d ...
- Tornado引入静态css、js文件
一.静态路径 template_path=os.path.join(os.path.dirname(__file__), "templates") 这里是设置了模板的路径,放置模板 ...
- 在引入的css或者js文件后面加参数的作用
有时候可能会遇到js或者css文件引用后传递参数: css和js带参数(形如.css?v=与.js?v=) <script type=”text/javascript” src=”jb51.js ...
- coding++ :在引入的css或者js文件后面加参数的作用
前沿: 有些小伙伴们在页面(F12)直接对 JS.CSS 文件进行编辑.或者打断点调试的时候 可能会发现 所有的操作都不生效,为什么? 原因可能存在以下情况 有时候可能会遇到js或者css文件引用后传 ...
- CI框架引入外部css和js文件
首先在项目根目录下建立assets文件夹,在这个文件夹下再建立css和js文件夹分别放置css和js文件 然后,在项目根目录下建立.htaccess文件 内容如下: RewriteEngine on ...
- IE浏览器没有加载CSS或js文件的秘密及解决办法
其实是两处资料拼成这一篇博文的,因为在开发过程中遇到,有的文章只是说明原因,而没有给出解决方案,所以再次给出解释和解决方法,以供参考,如果有好的解决方法,也请分享下! ---------------- ...
随机推荐
- IP地址分类的计算方法
IP地址由四段组成,每个字段是一个字节,8位,最大值是255,但实际中我们用点分十进制记法. IP地址由两部分组成,即网络地址和主机地址.网络地址表示其属于互联网的哪一个网络(常见ABC三类,以固定网 ...
- composer的autoload来自动加载自己编写的函数库与类库?
1.使用命令composer init生成composer.json文件,并编辑autoload选项内容如下: 其中又包含主要的两个选项: files 和 psr-4. files就是需要compos ...
- XSS(跨站脚本攻击) - 常用代码大全
XSS(跨站脚本攻击) - 常用代码大全-版本一 1'"()&%<acx><ScRiPt >prompt(915149)</ScRiPt> < ...
- 了解 MySQL的数据行、行溢出机制吗?
目录 一.行 有哪些格式? 二.紧凑的行格式长啥样? 三.MySQL单行能存多大体量的数据? 四.Compact格式是如何做到紧凑的? 五.什么是行溢出? 六.行 如何溢出? 七.思考一个问题 关注送 ...
- 巧妙运用Camtasia 旅行Vlog轻松get
旅行时,除了要欣赏当地的美丽风景.享受当地美食外,当然还要将旅行中的各种小细节记录下来.以前我们可能更多地使用相机拍照,现在呢,越来越多的人采用视频拍摄的方式制作Vlog.这种兼具影像与叙事的视频表现 ...
- mac中怎么完成移动硬盘分区这个操作
移动硬盘在出厂时只有一个区,不方便我们存储和查阅文件,移动硬盘分区可以防止硬盘发生错误,以免造成资料丢失,也可以防止产生无用文件. 移动硬盘基本上都是用Windows系统进行分区的,但是现在很多人使用 ...
- guitar pro系列教程(二十四):Guitar Pro 7 中文界面的介绍
用过Guitar Pro这款软件的小伙伴们都知道,Guitar Pro这款吉他软件因为是国外开发商研发的,所以软件最初都是英文版本,对于国内的的吉他爱好者来说,在软件使用上还是很不方便的.随着Guit ...
- 【ACwing 95】费解的开关——枚举 + 搜索
(题面来自ACwing) 你玩过"拉灯"游戏吗?25盏灯排成一个5x5的方形.每一个灯都有一个开关,游戏者可以改变它的状态.每一步,游戏者可以改变某一个灯的状态.游戏者改变一个灯的 ...
- Java集合【6】-- Collection和Collections的区别
刚开始学java的时候,分不清Collection和Collections,其实这两个东西是完全不一样的东西. Collection是一个接口,是java集合中的顶级接口之一,衍生出了java集合的庞 ...
- 6.2 Binding基础
WPF最为核心的思想是数据驱动UI,实现这一技术的基石就是绑定技术(binding).如果把Binding比作数据的桥梁,那么它的两端分别是源(Source)和目标(Target),Binging是架 ...