Pirate of Marmara Pirate of Marmara - 6 months ago 39
CSS Question

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

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']);

Answer Source
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.

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download