zoukankan      html  css  js  c++  java
  • 寻找替代imagemin更好的插件

     文中列举了三种方式,前两种主要还是imagemin插件,一种是常规方式,一种是自带的深度压缩方式,最后给出了更一种插件tinypng插件,相信前端小伙伴们都知道这个网站,唯一不好的就是使用这个插件前500张是免费的,但是一个邮箱可以申请一个KEY,一个KEY可以用500张,所以如果需求量大的可以多申请几个邮箱或者在官网上面用$购买。不多说贴出代码。

    const gulp = require('gulp');
    const imagemin = require('gulp-imagemin');
    const pngquant = require('imagemin-pngquant');
    const tinypng = require('gulp-tinypng-compress');

    第一种方法:imagemin的常规方法

    /*此方法只能压缩部分,比如说一个图片580K,这个方法只能压缩到510K,但是在tinyPny方法下可以压缩到100多k*/
    gulp.task('imageMin', () =>
        gulp.src('src/images/*')
            .pipe(imagemin({
                optimizationLevel: 7, //类型:Number  默认:3  取值范围:0-7(优化等级)
                progressive: true, //类型:Boolean 默认:false 无损压缩jpg图片
                interlaced: true, //类型:Boolean 默认:false 隔行扫描gif进行渲染
                multipass: true //类型:Boolean 默认:false 多次优化svg直到完全优化
            }))
            .pipe(gulp.dest('dist/images'))
    );

    第二种方法:增加了pngquant插件的高度压缩插件,但是测试了并没什么用。

    /*此方法只能压缩部分,比如说一个图片580K,这个方法只能压缩到510K,但是在tinyPny方法下可以压缩到100多k*/
    gulp.task('imageMin', () =>
        gulp.src('src/images/*')
            .pipe(imagemin({
                optimizationLevel: 7, //类型:Number  默认:3  取值范围:0-7(优化等级)
                progressive: true, //类型:Boolean 默认:false 无损压缩jpg图片
                interlaced: true, //类型:Boolean 默认:false 隔行扫描gif进行渲染
                multipass: true //类型:Boolean 默认:false 多次优化svg直到完全优化
            }))
            .pipe(gulp.dest('dist/images'))
    );

    第三种方法:tinypng插件,官网上面直接压缩是只有单次20张数量、单张最大5M限制,总数没有限制。(https://tinypng.com/)

    /*tinyPng要收费,效果不错,一个非QQ邮箱可以免费500张*/
    gulp.task('tinyPng', () =>
        gulp.src('src/images/*/*')
        .pipe(tinypng({
            key: '自己申请的key',//qinyulin036@sina.com
            sigFile: 'images/.tinypng-sigs',
            log: true
        })).on('error', function(err) {
            console.error(err.message);
        })
        .pipe(gulp.dest('dist/images'))
    );

    最后的任务执行代码

    gulp.task('default', ['imageMin']);
  • 相关阅读:
    蛙蛙推荐:一个程序员2012年技术学习总结
    蛙蛙推荐:第一堂编程课提纲
    蛙蛙推荐:笨办法提高代码质量
    蛙蛙推荐:Backbone和seajs搭配最佳实践探讨
    时髦的互联网公司都在用什么技术?
    蛙蛙推荐:让SecureCRT好使起来
    Linux LVM卷组管理 规格严格
    聊聊jdbc statement的fetchSize 规格严格
    老生常谈: Eclipse远程调试 规格严格
    产品经理的34个感想
  • 原文地址:https://www.cnblogs.com/qinyulin/p/8526947.html
Copyright © 2011-2022 走看看