CODEWITHSUNDEEP
csssassgulpgulp-watch
wonder_dev22
wonder_dev22

Reputation: 91

Gulp Watch starts but doesn't compile

When compiling my gulp file using "gulp watch", the gulp proces starts but doesn't compile. It isn't outputting any errors, so I'm not sure why it's starting but not compiling any of the files. This is what my gulp file currently looks like:

const gulp = require('gulp');
const stylus = require('gulp-stylus');
const nib = require('nib');
const rupture = require('rupture');
const sourcemaps = require('gulp-sourcemaps');
const postcss = require('gulp-postcss');
const autoprefixer = require('autoprefixer');
//const concat = require('gulp-concat');

// compiles styl to css and creates updates source map
gulp.task('styles', function(){
    gulp.src('css/styl/style.styl')
        .pipe(sourcemaps.init()) // <-- place sourcemaps.init before stylus nib pipe so that nib is included in sourcemap
        .pipe(stylus({
            use: [nib(),rupture()]
        }))
        .pipe(postcss([ autoprefixer() ]))
        //.pipe(concat('style.css'))
        .pipe(sourcemaps.write('.'))
        .pipe(gulp.dest('./css'));
});

gulp.task('watch', function(){
    gulp.watch('css/**/*.styl', gulp.series('styles'));
});

Upvotes: 1

Views: 216

Answers (1)

Karl-Johan Sj&#246;gren
Karl-Johan Sj&#246;gren

Reputation: 17532

As it is currently written it would compile on changes only, not on startup. What you want is to make your watch-task dependent on your styles task, so that styles is run before it starts watching. You can do this by passing another argument to gulp.task like this.

gulp.task('watch', ['styles'] function() {
    gulp.watch('css/**/*.styl', gulp.series('styles'));
});

Upvotes: 1

Related Questions