分别安装gulp-rev、gulp-rev-collerctor、gulp-asset-rev,安装了的略过

npm install gulp-rev --save-dev

npm install gulp-rev-collerctor --save-dev

npm install gulp-asset-rev --save-dev

gulp-asset-rev是处理css图片路径哈希值的

打开node_modules\gulp-assets-rev\index.js

78行 var verStr = (options.verConnecter || "-") + md5;
更新为:var verStr = (options.verConnecter || "") + md5;
80行 src = src.replace(verStr, '').replace(/(\.[^\.]+)$/, verStr + "$1");
更新为:src=src+"?v="+verStr;

//版本号添加修改

.打开node_modules\gulp-rev\index.js

     第144行 manifest[originalFile] = revisionedFile;
更新为: manifest[originalFile] = originalFile + '?v=' + file.revHash;

.打开nodemodules\gulp-rev\nodemodules\rev-path\index.js

    10行 return filename + '-' + hash + ext;
更新为: return filename + ext;

第三步:打开node_modules\gulp-rev-collector\index.js

第一处修改为:

if ( !_.isString(json[key]) || path.basename(json[key]).split('?')[] !== path.basename(key) ) {
isRev = ;
}

第二处修改为:

var rp = pattern.replace(/[\-\[\]\{\}\(\)\*\+\?\.\^\$\|\/\\]/g, "\\$&");
rp = pattern + "(\\?v=(\\d|[a-z]){8,10})*";
return rp;

第三处修改为:

patterns.push( escPathPattern( (path.dirname(key) === '.' ? '' : closeDirBySep(path.dirname(key)) ) + path.basename(key, path.extname(key)) )
+ opts.revSuffix
+ escPathPattern( path.extname(key) ) + "(\\?v=(\\d|[a-z]){8,10})*"
);

可能因为版本更替,可能行号变了,具体以图为准

详情见图片 图片为修改后的内容

gulp 添加版本号 解决浏览器缓存问题的更多相关文章

  1. js 给url添加时间戳 解决浏览器缓存

    //解决浏览器缓存 function timestamp(url){      //  var getTimestamp=Math.random(); var getTimestamp=new Dat ...

  2. 给js加版本号解决浏览器缓存问题

    我们知道打开网页时浏览器会加载需要的资源,比如图片.音频.js文件.css文件等.并且会把这些资源作为缓存保存下来,再次打开网页时缓存好的资源就不需要再次加载了.但是,这样有一个问题,就是当程序猿更新 ...

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

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

  4. 给url添加时间戳,解决浏览器缓存

    //解决浏览器缓存function timestamp(url){ // var getTimestamp=Math.random(); var getTimestamp=new Date().get ...

  5. 在Js或者cess后加版本号 防止浏览器缓存

    在Js或者cess后加版本号 防止浏览器缓存 客户端浏览器会缓存css或js文件,从而减少加载次数,减少流量,提高网页的访问速度.为了使得每次修改js或者css能生效,可以通过改变版本号来使得客户端浏 ...

  6. js进阶解决浏览器缓存不能自动更新的问题(在ajax的url上带上一个参数,可以是日期,或者是随机数)(随机数Math.random)(取得日期的毫秒数:new Date().getTime();)

    js进阶解决浏览器缓存不能自动更新的问题(在ajax的url上带上一个参数,可以是日期,或者是随机数)(随机数Math.random)(取得日期的毫秒数:new Date().getTime();) ...

  7. 使用gulp添加版本号

    由于js和css的缓存问题,所以,希望在html上给js和css添加上版本号. 常见的用法是使用gulp-rev和gulp-rev-collector进行操作.使用这两个插件,得到的效果如下图所示: ...

  8. 学习笔记:Maven构造版本号的方法解决浏览器缓存问题

    需要解决的问题 在做WEB系统开发时,为了提高性能会利用浏览器的缓存功能,其实即使不显式的申明缓存,现代的浏览器都会对静态文件(js.css.图片之类)缓存.但也正因为这个问题导致一个问题,就是资源的 ...

  9. js 给链接 url或href或js、css、图片等解决浏览器缓存

    一. 添加时间戳 情况一.链接是常量 var rand = new Date().getTime(); var aLen=document.getElementsByTagName("a&q ...

随机推荐

  1. JIRA 资源

    https://www.**.com/article/2015/8/7/22532.html e_v_g_e_t JIRA使用教程:在Windows上安装JIRAJIRA使用教程:在Linux上安装J ...

  2. Maven打包将所有的依赖都打入

    附上pom.xml <project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www ...

  3. 【Properties】在Properties中配置List

    my.properties master.pool[0].id=poolId001 master.pool[0].endpoint=http://192.168.1.101:8080/v1 maste ...

  4. HTTP/HLS/RTMP超级负载测试工具

    这个负载测试工具是网游分享的工具,可以在http://blog.csdn.net/win_lin/article/details/11835011 或者https://github.com/winli ...

  5. Excel导入MS SQL SERVER 操作

    关于Excel导入到sql操作的相关问题总结: 一.大批量数据导入 方法1.从Excel大批量数据导入时我们可以使用sql里面有一个batch copy的功能 方法2.在sql中建一个table ty ...

  6. [UE4]Canvas Panel

    一.Canvas Panel:画布.Canvas Panel中内的元素可以任何摆放位置.Canvas Panel是UserWiget默认的根节点容器,可以把跟节点删除替换生成任何的UI元素. 二.选择 ...

  7. linux达人养成计划

    一.命令基本格式: ls -1 详细列表 (ll) -h 人性化显示文件大小 -a 显示所有文件,包括隐藏文件 -d 查看目录属性 -i 显示iNode 二.文件处理命令 mkdir -p [目录名] ...

  8. 00008 - crontab定时执行任务命令详解

    linux 系统则是由 cron (crond) 这个系统服务来控制的.Linux 系统上面原本就有非常多的计划性工作,因此这个系统服务是默认启动的.另 外, 由于使用者自己也可以设置计划任务,所以, ...

  9. SAS 数据集生成map 文件

    OPTIONS NOCENTER PS=MAX LS=MAX; LIBNAME S '.'; DATA A;    INPUT X $ @@;    CARDS;A1 A2 A3 B1 B2 B3   ...

  10. 牛客网剑指Offer——正则表达式匹配

    1. 题目描述 请实现一个函数用来匹配包括'.'和'*'的正则表达式.模式中的字符'.'表示任意一个字符,而'*'表示它前面的字符可以出现任意次(包含0次). 在本题中,匹配是指字符串的所有字符匹配整 ...