1:安装nodejs
2:npm install --save-dev gulp
npm install --save-dev gulp-rev
npm install --save-dev gulp-rev-collector
npm install --save-dev gulp-asset-rev
npm install --save-dev run-sequence
3:在项目根目录下创建gulpfile.js(配置如下)
gulpfile.js 配置
//引入gulp和gulp插件 var gulp = require('gulp'), rev = require('gulp-rev'), revFormat=require('gulp-rev-format'), revCollector = require('gulp-rev-collector') var assets=[ 'tabpBiz/resources/**/*.css', 'tabpBiz/resources/**/*.js', 'tabpBiz/resources/**/*.{png,PNG,jpg,JPG,Jpeg}' ] // 生成版本号清单 gulp.task('rev', function (){ gulp.src(assets) .pipe(rev()) .pipe(revFormat({ prefix: '.', // 在版本号前增加字符 lastExt: false })) .pipe(rev.manifest()) .pipe(gulp.dest("rev/json")); }); gulp.task('add-version',['rev'], function() { gulp.src(["rev/json/*.json",'tabpBiz/WEB-INF/ftl/**/*.ftl']) .pipe(revCollector({replaceReved:true})) .pipe(gulp.dest('tabpBiz/WEB-INF/ftl')); }); gulp.task('default', ['add-version']);
4:在项目根目录下创建package.json(配置如下)
package.json 配置(无需更改,执行npm安装插件devDependencies会自动添加)
{ "name": "test", "version": "1.0.0", "devDependencies": { } }
5:修改
node_modules\
gulp-rev-collector/index.js文件
一、
/*if ( !_.isString(json[key]) || path.basename(json[key]).replace(new RegExp( opts.revSuffix ), '' ) !== path.basename(key) ) {
isRev = 0;
}*/
if ( !_.isString(json[key]) || path.basename(json[key]).split('?')[0] !== path.basename(key) ) {
isRev = 0;
}
二、
//return pattern.replace(/[\-\[\]\{\}\(\)\*\+\?\.\^\$\|\/\\]/g, "\\$&");
//禁止重复添加版本号
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) )
);*/
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})*"
);
6 打开node_modules\gulp-rev\index.js
/*manifest[originalFile] = revisionedFile;*/
manifest[originalFile] = originalFile + '?v=' + file.revHash;
ode