Gulp-排除变量文件名

Question

I have my full gulp file below. It compiles my CSS, and then uses another function to take my CSS file, minify it, and then copy it over to another folder "assets/css".

The file I'm looking to exclude is mainStyle. If I don't exclude this, I get a perpetual loop in my watch task.

When I run the file, because I have the !mainStyle toward the bottom, I get the error "TypeError: pattern.indexOf is not a function".

var themename = 'themename';

var gulp = require('gulp'),
    // Prepare and optimize code etc
    autoprefixer = require('autoprefixer'),
    browserSync = require('browser-sync').create(),
    image = require('gulp-image'),
    jshint = require('gulp-jshint'),
    postcss = require('gulp-postcss'),
    sass = require('gulp-sass'),
    sourcemaps = require('gulp-sourcemaps'),
    cleanCSS = require('gulp-clean-css'),


    // Only work with new or updated files
    newer = require('gulp-newer'),

    // Name of working theme folder
    root = '../' + themename + '/',
    scss = root + 'sass/',
    js = root + 'js/',
    img = root + 'images/',
    languages = root + 'languages/';
    mainStyle = root + 'style.css';



// CSS via Sass and Autoprefixer
gulp.task('css', function() {
    return gulp.src(scss + '{style.scss,rtl.scss}')
    .pipe(sourcemaps.init())
    .pipe(sass({
        outputStyle: 'expanded', 
        indentType: 'tab',
        indentWidth: '1'
    }).on('error', sass.logError))
    .pipe(postcss([
        autoprefixer('last 2 versions', '> 1%')
    ]))
    .pipe(sourcemaps.write(scss + 'maps'))
    .pipe(gulp.dest(root));
});


gulp.task('minify-css', () => {
  return gulp.src(mainStyle)
    .pipe(cleanCSS({level: {1: {specialComments: 0}}}, (details) => {
      console.log(`${details.name}: ${details.stats.originalSize}`);
      console.log(`${details.name}: ${details.stats.minifiedSize}`);
    }))
  .pipe(gulp.dest(root + '/assets/css/'));
});

// Optimize images through gulp-image
gulp.task('images', function() {
    return gulp.src(img + 'RAW/**/*.{jpg,JPG,png}')
    .pipe(newer(img))
    .pipe(image())
    .pipe(gulp.dest(img));
});

// JavaScript
gulp.task('javascript', function() {
    return gulp.src([js + '*.js'])
    .pipe(jshint())
    .pipe(jshint.reporter('default'))
    .pipe(gulp.dest(js));
});


// Watch everything
gulp.task('watch', function() {
    browserSync.init({ 
        open: 'external',
        proxy: 'example.local/',
        port: 8080
    });
    gulp.watch([ root + '**/*.css', root + '**/*.scss', !mainStyle ], ['css']);
    gulp.watch(js + '**/*.js', ['javascript']);
    gulp.watch(img + 'RAW/**/*.{jpg,JPG,png}', ['images']);
    gulp.watch(root + '**/*').on('change', browserSync.reload);
    gulp.watch(root + 'style.css', ['minify-css'])
});


// Default task (runs at initiation: gulp --verbose)
gulp.task('default', ['watch']);

Answer 1

The way you have your rule written is actually returning false . Change it to a string so it's properly interpreted as a minimatch rule.

gulp.watch([ root + '**/*.css', root + '**/*.scss', `!${mainStyle}` ], ['css']);