gulp 拷贝文件时如何移除文件目录结构

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.

相关推荐