编译适当的 gulp 文件

奥利弗·库查泽夫斯基

使用使用“gulp.watch”的 Gulp 和 Gulp-sass,如何返回监视列表中已更改项目的目录名称,以便我可以将 sass 编译为 css?

这就是我目前拥有它的方式;如您所见,只有一个目录正在编译,即主题 1。如果主题 2 或 3 在 SASS 中发生变化,主题 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']);
});
奥利弗·库查泽夫斯基

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

'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/'));
    });
});

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

gulp-sass不编译sass文件

来自分类Dev

Gulp-sass无法编译scss文件

来自分类Dev

gulp-sass不编译sass文件

来自分类Dev

sass文件未由gulp编译

来自分类Dev

从gulp编译中排除kendo文件

来自分类Dev

Gulp任务仅编译已更改的文件

来自分类Dev

编译 Gulp 到父文件夹

来自分类Dev

Gulp和Bower-创建适当的文件结构

来自分类Dev

Gulp监视整个文件夹并编译保存的文件

来自分类Dev

Gulp:如何创建可编译多个SASS文件的任务?

来自分类Dev

仅当文件已使用gulp更改时才编译sass

来自分类Dev

如何使用Gulp在不同目录下编译SASS文件?

来自分类Dev

更改文件时Gulp不会编译我的Sass

来自分类Dev

Laravel Elixir:Gulp不会编译Bootstrap Sass文件

来自分类Dev

Gulp使用@import监视和编译更少的文件

来自分类Dev

如何使用gulp编译在LESS中检测根文件

来自分类Dev

使用Gulp在Angular2中编译打字稿文件

来自分类Dev

更改文件时Gulp不会编译我的Sass

来自分类Dev

我如何在Gulp中排除从Typescript编译的javascript文件?

来自分类Dev

Gulp将SASS编译为相对的子文件夹

来自分类Dev

缩小后如何使Gulp将文件放置在构建中的适当目录中?

来自分类Dev

如何使用Gulp将多个打字稿文件编译为一个javascript文件?

来自分类Dev

如何使用 gulp 编译文件并保持相同的文件夹结构?

来自分类Dev

Gulp合并凉亭文件

来自分类Dev

用gulp复制文件

来自分类Dev

wired gulp,文件顺序

来自分类Dev

如何查看gulp文件?

来自分类Dev

Gulp:合并文件

来自分类Dev

gulp 文件 babelify 任务