gulp自动化构建工具--压缩img--学习笔记

最新推荐文章于 2021-03-24 23:50:55 发布

weixin_33788244

最新推荐文章于 2021-03-24 23:50:55 发布

阅读量99

点赞数

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/CaktyRiven/p/6419659.html

本文介绍如何通过Gulp及gulp-imagemin插件来实现图片的自动化压缩处理。包括安装gulp-imagemin、配置gulpfile.js文件以及执行任务等步骤。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1.安装gulp-imagemin

npm install gulp-imagemin 或者 cnpm install gulp-imagemin

2.编写gulpfile.js文件

 //获取gulp 
var gulp = require('gulp');

//获取gulp-imagemin 模块
var imagemin = require('gulp-imagemin')

//压缩图片任务
//在命令输入gulp images启动此任务
gulp.task('images',function(){
     //1.找到图片gulp
     gulp.src('views/images/*.*')
     //2.压缩图片
     .pipe(imagemin({
        progressive:true
     }))
     //3.另存图片
     .pipe(gulp.dest('views/dist/images'))
});

//在命令使用gulp auto启动此任务
gulp.task('auto',function(){
    //监听文件修改，当文件被修改则执行images任务
    gulp.watch('views/images/*.*',['images'])
});
//使用gulp.task('default')定义默认任务
//在命令行使用gulp启动images任务和auto任务
gulp.task('default',['images','auto'])