大多用的是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. ASP.NET Core:使用EntityFrameworkCore操作MySql来丰富仓储模块

    概述 上一篇简单介绍了Dapper的基本用法,数据的存储为SqlServer.那么这一篇就记录一下使用EFCore来操作MySql的一些方式,这种模式比较适合那种一个项目中需要操作多种数据库的模式.不 ...

  2. 03 编译安装apache的简易配置

    1.监听端口,默认为80,在主配置文件 /etc/httpd24/httpd.conf中可以更改 2.持久连接 Include /etc/httpd24/extra/httpd-default.con ...

  3. scrapy跟pyspider的杂谈

    最近有一个私人项目要搞,可能最近的博客都会变成爬虫跟数据分析类的了.既然是爬虫,第一反应想到的就是鼎鼎大名的scrapy了,其次想到的pyspider,最后想到的就是自己写. scrapy是封装了tw ...

  4. 关于echarts使用的常见问题总结

    关于echarts使用的问题总结1.legend图例不显示的问题: 在legend中的data为一个数组项,数组项通常为一个字符串,每一项需要对应一个系列的 name,如果数组项的值与name不相符则 ...

  5. 移动端设置fixed布局的问题解决

    最近写移动端,遇到一个问题就是用fixed属性布局的时候由于手机的原因会出现很多问题,比如说手机端底部固定一块,然后里面有输入框,(类似于手机QQ或者微信底部的输入框一样的布局)这个时候在调用软键盘的 ...

  6. 11.并发包阻塞队列之LinkedBlockingQueue

    在上文<10.并发包阻塞队列之ArrayBlockingQueue>中简要解析了ArrayBlockingQueue部分源码,在本文中同样要介绍的是Java并发包中的阻塞队列LinkedB ...

  7. 掌握Chrome Developer Tools:下一阶段前端开发技术

    Tips 原文作者:Ben Edelstein 原文地址:Mastering Chrome Developer Tools: Next Level Front-End Development Tech ...

  8. [0] JDK与JRE的区别

    JDK就是Java Development Kit.简单的说JDK是面向开发人员使用的SDK,它提供了Java的开发环境和运行环境.SDK是Software Development Kit 一般指软件 ...

  9. 聊聊RocksDB Compact

    | 导语 对于 LevelCompact 策略,RocksDB会根据每一层不同的策略计算出CompactScore,根据CompactScore大小来决定那一层将会优先进行Compact,然后选择Le ...

  10. Android的UI调优

    对于一个App的UI而言,在流畅性上的改进目标其实就是降低屏幕绘制的延迟,创建流畅和稳定的帧率以避免卡顿. 在理想情况下,全部的测量.布局和绘制的时间最好在16ms以内,这样才能保证屏幕运行的顺畅性. ...