gulp常见插件总结

  1. gulp-htmlmin:压缩html文件
  2. gulp-imagemin:压缩图片
  3. imagemin-pngquant:深度压缩png图片
  4. gulp-cache:只压缩修改的图片
  5. gulp-minify-css:压缩CSS文件
  6. gulp-make-css-url-version:给css文件引用文件加版本号(文件MD5)
  7. gulp-rev-append:通过正则(?:href|src)=”(.*)[?]rev=(.*)[“]查找并给指定链接填加版本号(默认根据文件MD5生成,因此文件未发生改变,此版本号将不会变)
  8. gulp-uglify:使用gulp-uglify压缩javascript文件,减小文件大小
  9. gulp-concat:使用gulp-concat合并javascript文件,减少网络请求
  10. gulp-autoprefixer:根据设置浏览器版本自动处理浏览器前缀。使用她我们可以很潇洒地写代码,不必考虑各浏览器兼容前缀。【特别是开发移动端页面时,就能充分体现它的优势。例如兼容性不太好的flex布局。】
  11. gulp-less
  12. gulp-livereload:当监听文件发生变化时,浏览器自动刷新页面。【事实上也不全是完全刷新,例如修改css的时候,不是整个页面刷新,而是将修改的样式植入浏览器,非常方便。】特别是引用外部资源时,刷新整个页面真是费时费力。

详细讲解以上命令

  1. gulp-htmlmin:压缩html文件
var gulp = require('gulp'),
    htmlmin = require('gulp-htmlmin');
gulp.task('testHtmlmin',function(){
    var options = {
        removeComments: true, //清除HTML注释
        collapseWhitespace:true, //压缩HTML
        collapseBooleanAttributes:true, //省略布尔属性的值 ==> 
        removeEmptyAttributes:true, //删除所有空格作属性的值 ==> 
        removeScriptTypeAttributes:true, //删除
                    
                    

你可能感兴趣的:(gulp)