gulp，css压缩，js压缩，css加密，js加密

最新推荐文章于 2024-07-16 08:49:00 发布

全栈工程师继续努力

最新推荐文章于 2024-07-16 08:49:00 发布

阅读量5.5k

点赞数

分类专栏： nodejs js html css css3 文章标签： gulp css压缩 js压缩 css加密 js加密

本文链接：https://blog.csdn.net/qq_16664643/article/details/52397216

版权

本文介绍了如何使用gulp工具进行CSS和JS的压缩、合并以及添加MD5后缀实现文件名加密。通过引入gulp-concat、gulp-minify-css、gulp-rev和gulp-rev-collector插件，实现了将多个CSS文件合并为一个，并进行一行化压缩，同时为文件添加MD5后缀，最后更新引用文件中的路径，确保更新后的文件能在项目中正确引用。

摘要由CSDN通过智能技术生成

为了防止客户端的静态资源缓存，我们需要每次更新css或js的时候，通过md5或时间戳等方式重新命名静态资源。让客户端可以重新请求资源，而不是从缓存里取。然后html模板里的src也要做相应的修改。当然，这里还有个附加的需要就是，静态资源需要自行优化（压缩合并）。

下面是我gulpfile.js的代码：　　

// 引入 gulp
var gulp = require('gulp');
 
// 引入组件
var htmlmin = require('gulp-htmlmin'), //html压缩
    imagemin = require('gulp-imagemin'),//图片压缩
    pngcrush = require('imagemin-pngcrush'),
    minifycss = require('gulp-minify-css'),//css压缩
    jshint = require('gulp-jshint'),//js检测
    uglify = require('gulp-uglify'),//js压缩
    concat = require('gulp-concat'),//文件合并
    rename = require('gulp-rename'),//文件更名
    notify = require('gulp-notify');//提示信息
 
// 压缩html
gulp.task('html', function() {
  return gulp.src('src/*.html')