Gulp.js - Gulp is not updating CSS files on the browser

Question

I'm using gulp.js and BrowserSync. When I save the CSS files no changes have been made. No problem with HTML files. And I'm not using LESS or SASS. I'm using pure CSS. The code for my gulp.js file is below:

var gulp = require('gulp');
var browserSync = require('browser-sync').create();

gulp.task('serve', function() {
    browserSync.init({
        server: "./"
    });
    gulp.watch(["./*.html", "./css/*.css"]).on('change', browserSync.reload);
});

gulp.task('default', ['serve']);

Zowie van Geest · Accepted Answer · 2017-08-16 13:43:51Z

1

var gulp = require('gulp');
var browserSync = require('browser-sync');
var reload = browserSync.reload;

gulp.task('serve', function() {
  browserSync({
    server: {
      baseDir: './'
    }
  });

  gulp.watch(['*.html', 'css/*.css'], {cwd: './'}, reload);
});

gulp.task('default', ['serve']);

Can you tryout this one it looks like you are configuring a basedir from your current directory and also include this in the watcher. I prefer using a dir name instead of ./ normally people use app as baseDir.

answered Aug 16, 2017 at 13:43

Zowie van Geest

1596 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Zowie van Geest Over a year ago

@PirateofMarmara No problem :)

Collectives™ on Stack Overflow

Gulp.js - Gulp is not updating CSS files on the browser

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related