在 gulp.dest 之后删除 gulp.src 文件？答案

【问题标题】：Removing gulp.src files after gulp.dest?在 gulp.dest 之后删除 gulp.src 文件？
【发布时间】：2014-07-20 01:51:17
【问题描述】：

我有一个场景，我的一个客户想要将 LESS 文件放入 src 目录（通过 FTP），并自动将它们作为 CSS 输出到 build 目录。对于每个 LESS 文件，一旦创建了其结果 CSS 文件，就应该将其从 src 目录中删除。如何使用 Gulp 做到这一点？

我现在的gulpfile.js 是：

var gulp = require("gulp");
var watch = require("gulp-watch");
var less = require("gulp-less");

watch({ glob: "./src/**/*.less" })
  .pipe(less())
  .pipe(gulp.dest("./build"));

这成功地检测到新的 LESS 文件被放入 src 目录并将 CSS 文件输出到 build。但它不会在之后清理 LESS 文件。 :(

【问题讨论】：

标签： javascript node.js file gulp mv

【解决方案1】：

使用gulp-clean。

一旦你使用管道，它就会清理你的 src 目录。当然，请在具有不同设置的备份上对其进行测试，如果您无法使其正常工作，请不要犹豫，创建第二个任务并在您的 less 任务完成后使用一些任务依赖项来运行清理。

如果我是对的，当我尝试在 gulp.dest 之后传递 gulp-clean 时，出了点问题，所以我有另一种方法来做到这一点，这是一个任务依赖的示例。

var gulp = require('gulp'),
    less = require('gulp-less'),
    clean = require('gulp-clean');

gulp.task('compile-less-cfg', function() {
    return gulp.src('your/less/directory/*.less')
               .pipe(less())
               .pipe('your/build/directory'));
});

gulp.task('remove-less', ['less'], function(){
    return gulp.src('your/less/directory)
               .pipe(clean());
});

这是针对不观看的任务。然后，您应该在 *.less 文件上使用watch，但您应该运行任务remove-less 而不是less。为什么？因为任务依赖。

当您调用remove-less 任务时，它只会在less 任务完成后启动。这样，文件只会在你的 less 编译结束后被删除，而不是在它的中间抛出错误。

由于我不是专家，因此它可能不是实现此功能的完美方法，但它是一种安全且有效的解决方案供您使用。理解 IMO 也很清楚。

【讨论】：

gulp-clean 已弃用。

【解决方案2】：

gulp-clean 已弃用。使用 npm 模块del。

npm install --save-dev del

Here 是你应该如何使用它。

var gulp = require('gulp');
var del = require('del');

gulp.task('clean:mobile', function () {
  return del([
    'dist/report.csv',
    // here we use a globbing pattern to match everything inside the `mobile` folder
    'dist/mobile/**/*',
    // we don't want to clean this file though so we negate the pattern
    '!dist/mobile/deploy.json'
  ]);
});

gulp.task('default', ['clean:mobile']);

【讨论】：