您通常不希望在与原始文件相同的目录中生成缩小的文件。将生成脚本生成的所有文件写入单个输出目录。这种方法的一些优点是：

• 使清理构建和从头开始重新创建所有内容变得更容易：只需删除一个输出文件夹
• 您不必担心生成的文件会意外地被构建拾取并再次处理

但是既然你问了，这里有一个解决方案，可以在与原始文件相同的目录中创建缩小的文件。这将为每个. css和. js文件创建一个.min.css和.min.js文件。所有CSS文件都被假定在一个名为css（或其子目录）的目录中，所有JS文件都被假定在一个名为js（或其子目录）的目录中：

var gulp = require('gulp');
var rename = require('gulp-rename');
var cssnano = require('gulp-cssnano');
var uglify = require('gulp-uglify');

gulp.task('css', function () {
  return gulp.src([
      'css/**/*.css',
      '!css/**/*.min.css',
     ])
    .pipe(cssnano())
    .pipe(rename(function(path) {
      path.extname = ".min.css";
    }))
    .pipe(gulp.dest('css'));
});

gulp.task('js', function () {
  return gulp.src([
      'js/**/*.js',
      '!js/**/*.min.js',
     ])
    .pipe(uglify())
    .pipe(rename(function(path) {
      path.extname = ".min.js";
    }))
    .pipe(gulp.dest('js'));
});

gulp.task('default', ['css', 'js']);

注意否定模式！css/***。min.css用于防止已缩小的css在下一次构建时再次缩小。JavaScript也是如此。

我使用gulp cssnano和gulp uglify来缩小CSS和JS，但是还有很多其他选项可以作为替代品。