javascript - Gulp watch logging that it runs，但我的文件没有改变

Question

编辑:在下面解决

这是我的gulp文件

var gulp = require('gulp');
var sass = require('gulp-sass');
var minify = require('gulp-minify');
var concat = require('gulp-concat');
var sourcemaps = require('gulp-sourcemaps');

var allSassFiles = 'scss/**/*.scss';
var sassFile = gulp.src('./scss/style.scss');
var cssDest = '../wp-content/themes/Jupiter-child/uwkc_assets/css');

var sassify = function() {
  return sassFile.pipe(sourcemaps.init())
    .pipe(sass({outputStyle: 'compressed', onError: sass.logError}))
    .pipe(gulp.dest(cssDest + '/prod'))
    .pipe(sourcemaps.write())
    .pipe(gulp.dest(cssDest));
};

gulp.task('doSass', sassify);

gulp.task('watchSass', function(){
  return gulp.watch(allSassFiles, ['doSass']);
});

sass glob 是变量“allSassFiles”。秒当我运行任务“doSass”时，一切都编译得很好。我的 css 更改显示在浏览器中。

然而，当我运行“watchSass”任务时，事情只会改变一次，然后进一步的改变不会反射(reflect)在浏览器中。这就像只运行一次“doSass”。

奇怪的是，在我的控制台中，我看到了 doSass 的启动和完成日志，就好像一切都运行良好一样。但是，我没有看到对我的 css 目标文件进行任何更改。

我已经尝试了很多东西，混合了我要返回的内容，更改了 glob 语法。很多东西。出于某种原因，我无法让这该死的东西工作。

有人看到我可能遗漏了什么吗？我感觉它与 gulp-sass 或 sourcemaps 返回的内容有关，但我对这些了解不多，无法找出答案。

谢谢大家!

Answer 1

这是我想出来的:

显然，每次我在 watch 运行时运行 sassify 时，我都需要创建一个新的 gulp.src() 对象。我也希望我能正确使用这些术语。

我重写了:

return sassFile.pipe(sourcemaps.init())

在 sassify 函数中:

return gulp.src('./scss/style.scss').pipe(sourcemaps.init())

这成功了。对我来说，watch 会重新使用变量 sassFile 中引用的相同 src 对象，这对我来说很有意义，它不代表已更改的 scss 文件。