ASP.NET MVC 静态资源打包和压缩问题小记
ASP.NET MVC 中有个 BundleConfig 用于静态资源的打包和压缩,我在使用的过程中遇到一些问题,现在做下总结,并给出具体的解决方案。
问题一:打包压缩后的 JavaScript 和 CSS 中引用的文件 404 错误。
代码如下:
// Styles.
bundles.Add(new StyleBundle("~/bundles/styles/site.css").Include("~/static/styles/site.css"));
// Scripts.
bundles.Add(new ScriptBundle("~/bundles/scripts/index.js").Include("~/static/scripts/index.js"));
分析原因:
仔细看其中一条错误信息,说找不到 /bundles/images/bgi.jpg
,但是这个图片实际在 /static/images
中。很明显就能看出来:如果访问路径和真实路径不一致,则 JavaScript 和 CSS 中的相对路径全部会悲剧。
所以解决方案有以下两种:
- 访问路径保持不变,但不在 JavaScript 和 CSS 中使用相对路径。
- 访问路径和真实路径保持一致。
第一种解决方案可行,但很难保证团队内成员不在 JavaScript 和 CSS 中使用相对路径,同时也增加团队内成员的开发压力,所以我采用的是第二种解决方案,但随之而来的是第二个问题:
问题二:打包和压缩失效。
代码如下:
// Styles.
bundles.Add(new StyleBundle("~/static/styles/site.css").Include("~/static/styles/site.css"));
// Scripts.
bundles.Add(new ScriptBundle("~/static/scripts/index.js").Include("~/static/scripts/index.js"));
分析原因:
文件路径一致,文件名称也一致,打包和压缩都失效。猜想可能是访问到了真实的文件,将访问路径的文件名改了后又试了试,果然是这样。所以解决方案很简单:避免访问地址和真实地址一致即可。
总结
- 访问路径和真实路径不一致,JavaScript 和 CSS 中的相对路径全部会悲剧。
- 访问地址和真实地址一致,会直接访问到真实的文件,从而导致打包和压缩失效。
贴一下修改后的代码:
// Styles.
bundles.Add(new StyleBundle("~/static/styles/site").Include("~/static/styles/site.css"));
// Scripts.
bundles.Add(new ScriptBundle("~/static/scripts/index").Include("~/static/scripts/index.js"));
ASP.NET MVC 静态资源打包和压缩问题小记的更多相关文章
- ASP.NET Core Web 资源打包与压缩
本文将介绍使用的打包和压缩的优点,以及如何在ASP.NET Core应用程序中使用这些功能. 概述 在ASP.Net中可以使用打包与压缩这两种技术来提高Web应用程序页面加载的性能.通过减少从服务器请 ...
- ASP.NET Core 资源打包与压缩
ASP.NET Core 资源打包与压缩 在ASP.NET 中可以使用打包与压缩来提高Web应用程序页面加载的性能. 打包是将多个文件(CSS,JS等资源文件)合并或打包到单个文件.文件合并可减少We ...
- 静态资源打包:一个javescript 的src引用多个文件,一个link引用多个CSS文件
疑惑描述: 查看了淘宝网的首页源文件,看到这样的一个特殊的 <script src="http://a.tbcdn.cn/??s/kissy/1.1.6/kissy-min.js,p/ ...
- spring mvc 静态资源 404问题
spring mvc 静态资源 404问题 在web.xml配置servlet-mapping的时候,如果url-pattern设置为"/" (如下),很多人都会遇到导入js,cs ...
- Spring MVC静态资源处理——<mvc:resources /> ||<mvc:default-servlet-handler /> 转载
Spring MVC静态资源处理——<mvc:resources /> ||<mvc:default-servlet-handler /> mvcmvc:resources ...
- 详解vue静态资源打包中的坑与解决方案
本文主要解决: 1.vue-cli默认配置打包后部署至特定路径下静态资源路径错误问题; 2.静态资源打包使用相对路径后css文件引入图片路径错误问题. 一.问题 vue-cli 脚手架生成的默认打包配 ...
- ASP.NET MVC中的捆绑和压缩技术
概述 在众多Web性能优化的建议中有两条: 减少Http请求数量:大多数的浏览器同时处理向网站处理6个请求(参见下图),多余的请求会被浏览器要求排队等待,如果我们减少这些请求数,其他的请求等待的时间将 ...
- Spring MVC静态资源处理
优雅REST风格的资源URL不希望带 .html 或 .do 等后缀.由于早期的Spring MVC不能很好地处理静态资源,所以在web.xml中配置DispatcherServlet的请求映射,往往 ...
- Nginx的静态资源缓存以及压缩
Nginx是一款轻量级的网页服务器.反向代理器以及电子邮件代理服务器.Nginx采用的是异步非阻塞的通信机制(epoll模型),支持更大的并发连接.所谓的epoll模型:当事件没有准备好时,就放入ep ...
随机推荐
- 手机APP开发:学JAVA转安卓APP开发是不是很容易?
成都亿合云商小编为您分享:Android开发是以Java语言为基础的,Android 虽然使用Java 语言作为开发工具,但是在实际开发中发现,还是与Java SDK 有一些不同的地方.Android ...
- deepin linux 安装 mysql
一:安装mysql 打开deepin terminal: 在此过程中会提示输入两次密码,就是输入 root 账号密码,两次输入密码一样就可以了.然后一路Y安装成功. 一旦安装成功,MySql服务器会自 ...
- Android中使用Handler造成内存泄露的分析和解决
什么是内存泄露?Java使用有向图机制,通过GC自动检查内存中的对象(什么时候检查由虚拟机决定),如果GC发现一个或一组对象为不可到达状态,则将该对象从内存中回收.也就是说,一个对象不被任何引用所指向 ...
- ElasticSearch
ElaticSearch简介: ES是一个搜索引擎,基于当前最先进,最高效的全功能开源搜索引擎框架lucene ES还有许多功能: 分布式实时文件存储,并将每一个字段都编入索引,使其可以被搜索 近实时 ...
- 理解水平扩展和垂直扩展 (转载 http://yunjiechao-163-com.iteye.com/blog/2126981)
当一个开发人员提升计算机系统负荷时,通常会考虑两种方式垂直扩展和水平扩展.选用哪种策略主要依赖于要解决的问题 以及系统资源的限制.在这篇文章中我们将讲述这两种策略并讨论每种策越的优缺点.如果你已经 ...
- 从oracle数据库中导出excel问题导致乱码的问题
使用plsqldev工具将oracle的查询结果导出为excel,结果可以成功导出,但是使用libreoffice进行查看时,有好多记录都是空的. 使用python进行导出(openpyxl模块进行e ...
- 基于海明距离的加权平均值人职匹配模型(Sqlserver2014/16内存表实现)
最近给某大学网站制作一个功能,需要给全校所有的学生提供就业单位发布职位的自动匹配,学生登陆就业网,就可以查看适合自己的职位,进而可以在线投递. 全校有几万名学生,注册企业发布的职位也有上万,如何在很短 ...
- Spring透过ApplicationListener来触发contextrefreshedevent事件
Spring通过ApplicationListener接口来触发contextrefreshedevent事件在开发时有时候需要在整个应用开始运行时执行一些特定代码,比如初始化环境,准备测试数据.加载 ...
- WCF、MongoDB
http://www.cnblogs.com/quietwalk/archive/2011/08/09/2132573.html http://www.cnblogs.com/huangxinchen ...
- 递归将Map里的字段名由驼峰转为下划线
导航 定位 概述 算法设计 递归技巧 代码实现 定位 本文适合于想要使用Java递归地将Map里的Key字段名从驼峰转为下划线,或者想了解如何处理任意递归的Map结构的筒鞋. 概述 在进行多语言混合编 ...