为何Gulp仍压缩代码？移除uglify后仍输出压缩JS及缓存问题咨询

看起来你遇到了Gulp缓存搞出来的小麻烦——明明已经删掉了uglify的配置，却还能输出压缩后的JS，而且任务快得离谱，这肯定是缓存在搞鬼！下面给你几个实用的解决办法，帮你强制Gulp每次都从头执行所有任务：

先搞清楚缓存来自哪 #

Gulp本身没内置缓存，但你用的插件（比如gulp-csso、之前的gulp-uglify-es）或者可能用过的gulp-cache这类工具，都会偷偷把处理过的结果存起来，下次直接用缓存跳过处理。另外，Gulp读取文件的流也有默认缓存，所以我们从这几个地方下手：

1. 排查并移除第三方缓存插件 #

如果你之前加过gulp-cache这类专门做缓存的插件，直接把任务链里的.pipe(cache(...))代码删掉就行，断了缓存的源头。

2. 给现有插件禁用缓存开关 #

很多压缩类插件都自带缓存开关，哪怕你已经删了uglify，比如gulp-csso也可能在悄悄缓存处理结果：

• 给gulp-csso加配置禁用缓存：

  .pipe(minifyCSS({ cache: false }))
  

要是之后再用到gulp-uglify-es，也可以加上同样的参数彻底禁用它的缓存：

.pipe(uglify({ cache: false }))

3. 最稳妥的办法：先清空输出目录再执行任务 #

直接把输出文件夹清空，旧文件都没了，自然不会有缓存残留。步骤很简单：

• 先安装gulp-clean插件：

  npm install gulp-clean --save-dev
  

• 然后在你的gulp.js里新增清理任务，再让其他任务依赖它执行：

  var gulp = require('gulp');
  var minifyCSS = require('gulp-csso');
  var uglify = require('gulp-uglify-es').default;
  var concat = require('gulp-concat');
  var sourcemaps = require('gulp-sourcemaps');
  var clean = require('gulp-clean'); // 新增引入清理插件
  
  // 清理输出目录，把这里的'dist'换成你实际的输出文件夹路径
  gulp.task('clean', function() {
    return gulp.src('dist', { allowEmpty: true })
      .pipe(clean());
  });
  
  // 修改css任务，先执行clean再处理文件
  gulp.task('css', gulp.series('clean', function(){
    return gulp.src([/* 你的CSS源文件路径 */])
      .pipe(sourcemaps.init())
      .pipe(concat('style.min.css'))
      .pipe(minifyCSS())
      .pipe(sourcemaps.write('.'))
      .pipe(gulp.dest('dist/css'));
  }));
  
  // JS任务也可以照这个逻辑修改，先clean再处理
  

这样每次运行gulp css时，都会先把输出目录清空，再重新生成所有文件，绝对不会有旧缓存捣乱。

4. 强制刷新Gulp的文件流缓存 #

Gulp的src方法默认会缓存文件的状态，你可以通过配置参数直接禁用它：

gulp.src([/* 你的源文件路径 */], { read: false, since: false })

不过这个办法会让任务变慢一点，因为每次都会重新读取所有文件，但能确保Gulp拿到的是最新的文件状态。

内容的提问来源于stack exchange，提问作者Michiel van der Blonk