大多用的是gulp-rev、gulp-rev-collerctor两个插件,但过程有点麻烦,使用gulp-rev-append插件轻松搞定

github:   https://github.com/bustardcelly/gulp-rev-append

安装插件

npm install gulp-rev-append --save-dev

gulpfile.js

var rev = require("gulp-rev-append");//引入插件
gulp.task("rev",function(){//任务
gulp.src('F:/test/myproject/**/*.html')//目标文件夹
.pipe(rev())
.pipe(gulp.dest('./dist'));//输出文件夹
});

html

<script type="text/javascript" src="js/function.js?rev=@@hash"></script>

注意:后缀必须是 rev=@@hash 源码第9行可以看到正则表达式

效果

注意事项:

这里作者说到文件后面加参数(xxx.js?v=HASH)的方法会使某些使用proxy cache的资源失效,而更改文件名(XXX_HASH.js)的方式不会

gulp-rev-append静态资源添加版本号后缀,清理缓存的更多相关文章

  1. 动态script标签同步加载 ps:无打包编译,静态实现静态资源入口动态配置,无编译打包静态资源添加版本号

    /**功能:创建动态标签加载css ,js文件,重点是js文件,利用onloading加递归实现动态标签的同步加载用法:在html文件body底部script内部声明并调用下列函数,obj中写要加载的 ...

  2. springMVC 静态资源加版本号

    springMVC 静态资源加版本号 http://blog.csdn.net/zhangt85/article/details/42126275

  3. [Asp.net Mvc]为js,css静态文件添加版本号

    方式一: 思路 string version = ViewBag.Version; @Scripts.RenderFormat("<script type=\"text/ja ...

  4. [Asp.net Mvc]通过UrlHelper扩展为js,css静态文件添加版本号

    写在前面 在app中嵌入h5应用,最头疼的就是缓存的问题,比如你修改了一个样式,或者在js中添加了一个方法,发布之后,并没有更新,加载的仍是缓存里面的内容.这个时候就需要清理缓存才能解决.但又不想让w ...

  5. gulp 添加版本号 解决浏览器缓存问题

    分别安装gulp-rev.gulp-rev-collerctor.gulp-asset-rev,安装了的略过 npm install gulp-rev --save-dev npm install g ...

  6. 静态html引入js添加随机数后缀防止缓存

    在web项目开发中,页面引入js被修改时,为避免浏览器缓存引起的问题,在引入js时,给js名后面加上随机数,以保证每次都发送新的请求. 在jsp中,一般通过后台取随机数即可,代码如下: <scr ...

  7. Nginx实践篇(2)- Nginx作为静态资源web服务 - 控制浏览器缓存、防盗链

    一.控制浏览器缓存 1. 浏览器缓存简介 浏览器缓存遵循HTTP协议定义的缓存机制(如:Expires;Cache-control等). 当浏览器无缓存时,请求响应流程 当浏览器有缓存时,请求响应流程 ...

  8. vue cli3.0 build 打包 的 js 文件添加版本号 解决 js 缓存问题

    在 vue.config.js 的文件中加入下面这段话 // vue.config.jsconst Timestamp = new Date().getTime();module.exports = ...

  9. Spring MVC静态资源处理

    优雅REST风格的资源URL不希望带 .html 或 .do 等后缀.由于早期的Spring MVC不能很好地处理静态资源,所以在web.xml中配置DispatcherServlet的请求映射,往往 ...

随机推荐

  1. cas4.2.7 取消https

    cas.properties 修改两个地方 # Decides whether SSO cookie should be created only under secure connections. ...

  2. JSP/Servlet Web 学习笔记 DayTwo

    JSP指令 a)page指令 定义JSP文件中的全局属性.一个JSP页面可以包含多个page指令.除了Import以外,其他page指令定义的属性/值只能出现一次. 其详细语法为: <%page ...

  3. python基础操作_元组_字典操作

    #元组'''元组是不可变的列表,不能改.取值和列表一样'''tp=(1,2,3)tp1=('127.0.0.1','3307')#元组只有count 和index两个方法.lis=['127.0.0. ...

  4. [github项目]基于百度地图二次开发实现的车辆监管(包含车辆定位、车辆图片和方向控制,电子围栏,图形绘制等功能)前端实现(不包含后端实现)

    前言:基于百度地图javascript版本开发,百度地图中所用的key已承诺仅用于测试,不用于商业用途 注:本文所有代码可以到github上进行下载,github地址:http://map.eguid ...

  5. Dalvik详解

    整理自百度百科 Dalvik Dalvik是Google公司自己设计用于Android平台的Java虚拟机.Dalvik虚拟机是Google等厂商合作开发的Android移动设备平台的核心组成部分之一 ...

  6. 锁和监视器之间的区别 – Java并发

    在面试中你可能遇到过这样的问题:锁(lock)和监视器(monitor)有什么区别? 嗯,要回答这个问题,你必须深入理解Java的多线程底层是如何工作的. 简短的答案是,锁为实现监视器提供必要的支持. ...

  7. MVC中控制器当中需要绑定SelectList,也就是所谓的DropDownList

    ViewData["moduleList"] = new SelectList(new El_Basic_ModuleInfo().Rows().AsEnumerable(), & ...

  8. 关于MyEclipse修改项目名称后,部署到tomcat显示旧的项目名称

    问题:用Myeclipse部署项目的时候,     出现部署到tomcat下的项目是之前的项目,而不是当前的项目.   解决方案:工程名->右键->Properties->MyEcl ...

  9. java 线程的死锁问题

    以下的情况可能出现死锁 1.一个对象的同步方法去调用另一个对象的同步方法,同时另一个对象的同步方法也在调用这个对象的同步方法,导致一定几率的死锁,不一定每次都会出现死锁,模拟的代码如下 package ...

  10. WebSocket 结合 Nginx 实现域名及 WSS 协议访问

    简单了解一下 WebSocket 现在,很多网站为了实现推送技术,所用的技术都是轮询.轮询是在特定的的时间间隔(如每1秒),由浏览器对服务器发出HTTP请求,然后由服务器返回最新的数据给客户端的浏览器 ...