wuyou 2015-01-20
最近遇到一个问题,在做一个拷贝图片到dist目录的任务时,原图片文件结构也同时copy了过去,这不是我想要的。代码如下:
gulp.task('image', function () { return gulp.src(['src/images/*','src/components/**/images/*']) .pipe(imagemin({ progressive: true, svgoPlugins: [{removeViewBox: false}], use: [pngquant({ quality: '65-80', speed: 4 })] })) .pipe(gulp.dest('./dist/images/')); });
如何将所有目录下的图片文件copy到dist/images/下,并且移除掉compoents/**/images/下文件的目录结构呢,找了很久,解决方案如下:
1. 安装gulp-rename插件:
npm install gulp-rename --save-dev
声明变量
var rename = require('gulp-rename');
2.将image 任务改为
gulp.task('image', function () { return gulp.src(['src/images/*','src/components/**/images/*']) .pipe(rename({dirname: ''})) .pipe(imagemin({ progressive: true, svgoPlugins: [{removeViewBox: false}], use: [pngquant({ quality: '65-80', speed: 4 })] })) .pipe(gulp.dest('./dist/images/')); });
注意多了一行
.pipe(rename({dirname: ''}))
enjoy.