编译适当的 gulp 文件

Question

Using Gulp & Gulp-sass which makes use of 'gulp.watch', 我怎样才能return监视列表，这样我就可以将 sass 编译为 css?

我目前是这样的；如您所见，只有一个目录正在编译，即主题 1。如果 SASS 中的主题 2 或 3 发生变化，主题 1 css 将被更新。我希望它是有条件的，所以任何一个都会根据不同的变化而变化。

'use strict';

var gulp = require('gulp');
var sass = require('gulp-sass');

gulp.task('sass', function () {
    return gulp.src('./wp-content/themes/1/assets/sass/**/*.scss')
         .pipe(sass.sync().on('error', sass.logError))
         .pipe(gulp.dest('./wp-content/themes/1/'));
});

gulp.task('sass:watch', function () {
    gulp.watch('./wp-content/themes/1/assets/sass/**/*.scss', ['sass']);
    gulp.watch('./wp-content/themes/2/assets/sass/**/*.scss', ['sass']);
    gulp.watch('./wp-content/themes/3/assets/sass/**/*.scss', ['sass']);
});

Answer 1

虽然这是非常硬编码的，但这是我刚刚找到的解决方案。

'use strict';

var gulp = require('gulp');
var sass = require('gulp-sass');

gulp.task('sass', function () {
    // return gulp.src('./wp-content/themes/giggleselc/assets/sass/**/*.scss')
    //      .pipe(sass.sync().on('error', sass.logError))
    //      .pipe(gulp.dest('./wp-content/themes/giggleselc/'));
});

gulp.task('sass:watch', function () {
    var n1 = gulp.watch('./wp-content/themes/1/assets/sass/**/*.scss', ['sass']);
    var n2 = gulp.watch('./wp-content/themes/2/assets/sass/**/*.scss', ['sass']);
    var n3 = gulp.watch('./wp-content/themes/3/assets/sass/**/*.scss', ['sass']);

    n1.on('change', function(f) {
        return gulp.src('./wp-content/themes/1/assets/sass/**/*.scss')
            .pipe(sass.sync().on('error', sass.logError))
            .pipe(gulp.dest('./wp-content/themes/1/'));
    });
    n2.on('change', function(f) {
        console.log('Change Event:', f);
        return gulp.src('./wp-content/themes/2/assets/sass/**/*.scss')
            .pipe(sass.sync().on('error', sass.logError))
            .pipe(gulp.dest('./wp-content/themes/2/'));
    });
    n3.on('change', function(f) {
        return gulp.src('./wp-content/themes/3/assets/sass/**/*.scss')
            .pipe(sass.sync().on('error', sass.logError))
            .pipe(gulp.dest('./wp-content/themes/3/'));
    });
});

编译适当的 gulp 文件

Compiling appropriate gulp file

javascript

gulp

gulp-sass