Gulp 4不会完成sass任务

Question

有一些线程与此问题相关，但我没有设法找到解决方案或解释我的问题。

问题

我使用的是Gulp 4.0.0的本地版本，我原先存在的gulpfile.js工作顺利。

我正在我的Gulpfile中做什么：观察Sass文件的更改，自动修复它们并将输出文件重命名为theme.scss.liquid（对于Shopify），最后替换一些花括号以逃避Liquid变量。

萨斯任务

// Sass
gulp.task('sass', function() {
  gulp.src('./assets/scss/**/**/*.scss')
    .pipe(sass().on('error', function (err) {
      sass.logError(err);
      this.emit('end');
    }))
    .pipe(autoprefixer('last 2 versions'))
    .pipe(rename('theme.scss.liquid'))
    .pipe(replace('"{{', '{{'))
    .pipe(replace('}}"', '}}'))
    .pipe(gulp.dest('./assets/'));
});

观看任务

gulp.task('watch', function() {
  gulp.watch('./assets/scss/**/**/*.scss', gulp.series('sass'));
});

怎么了

• 运行gulp watch开始注意变化。
• 更改或保存我的Sass会启动sass任务。
• 没有其他事情发生

[12:55:33] Starting 'watch'...
[12:55:37] Starting 'sass'...

---

任何帮助非常感谢！

Answer 1

我和gulp.task和gulp v4有类似的问题

最好采用新的gulp 4语法。

const gulp = require('gulp');
// other dependencies
// ....

const sassFn = (cb) => {
  gulp.src('./assets/scss/**/*.scss')
    .pipe(sass().on('error', sass.logError))
    .pipe(autoprefixer('last 2 versions'))
    .pipe(rename('theme.scss.liquid'))
    .pipe(replace('"{{', '{{'))
    .pipe(replace('}}"', '}}'))
    .pipe(gulp.dest('./assets'));

  cb();
};

const watchFn = () => {
  gulp.watch('./assets/scss/**/*.scss', sassFn);
};

exports.watch = watchFn;
exports.default = watchFn;

我删除了gulp.series（），因为我认为它至少需要运行2个任务。我进一步改变了src和dest路径。