我们在项目中第一次使用grunt,我在Google和stackoverflow上花费了相当多的时间,但是找不到解决方案,目前我已经缩小了JS和CSS文件,但是在浏览器上我想将版本添加到缩小的JS和CSS文件是production.js
和production.css
,因此每当修改了资产(js和css)文件时,都可以使用grunt或in node在浏览器缓存中添加版本到文件
Concat.js
module.exports = function(grunt) {
grunt.config.set('concat', {
dist: {
src: ['assets/styles/style.css','assets/styles/bootstrap.css', 'assets/styles/font-awesome.css','assets/styles/jquery-ui.css'],
dest: 'assets/concat/production.css'
},
js: {
src: ['assets/js/src/jquery-2.1.3.js',
assets/js/src/jquery-ui.js',
'assets/js/src/bootstrap.js',
'assets/js/src/bootstrap-switch.js',
'assets/js/src/moment.js',
'assets/js/src/angular.js',
'assets/js/jquery.gritter.min.js',
'assets/js/dependencies/elements.js',
'assets/js/dependencies/layout.js',
'assets/js/dependencies/init.js',
'assets/js/dependencies/js_importer.js',
'assets/js/dependencies/sib_common.js',
'assets/js/angular-sanitize.min.js',
'assets/js/angular/home.js'
],
dest: 'assets/concat/production.js'
}
});
Index.ejs
<html lang="en">
<script src="/concat/production.js"></script>
<head>
<link href="/concat/production.css" rel="stylesheet" />
</head>
</html>
编辑
使用filerev实施但未创建版本
module.exports = function(grunt) {
grunt.config.set('filerev',{
filerev: {
options: {
algorithm: 'md5',
length: 8
},
files: {
src: ['assets/concat/production.js', 'assets/concat/production.css']
}
}
});
grunt.loadNpmTasks('grunt-filerev');
};
default.js
module.exports = function (grunt) {
grunt.registerTask('default',
['compileAssets', 'linkAssets','filerev' , 'watch']);
};
最佳答案
您可以使用“ grunt-cache-breaker”
npmjs/grunt-cache-breaker