CODEWITHSUNDEEP
gulpatom-editorgulp-watchbrowser-sync
Guille
Guille

Reputation: 652

Gulp browser-sync refreshing ATOM editor on file save?

I have the following gulp file setup for testing purposes of small ideas etc..

My project is setup the following way

Every time a save a html, css, or js from the site directory, instead of my browser refreshing, my atom text editor refreshes. Its kind of annoying. I have other projects setup similarly but they are work just fine. its just this one i can't seem to figure out.

is it my code, or something else?

var gulp = require('gulp'),
  bs = require('browser-sync').create(),
  sequence = require('run-sequence');

gulp.task('styles', function() {
  gulp.src('site/css/*.css')
    .pipe(gulp.dest('site/css'))
    .pipe(bs.stream());
});

gulp.task('js', function() {
  gulp.src(['site/js/*.js'])
    // .pipe(concat('all.js'))
    .pipe(gulp.dest('site/js'))
    .pipe(bs.stream());
});

gulp.task('html', function() {
  gulp.src('site/*.html')
    .pipe(gulp.dest('site/'))
    .pipe(bs.stream());
});

gulp.task('browser-sync', function() {
  bs.init({
    server: 'site'
  });
});

gulp.task('watch', ['build'], function() {
  gulp.watch(['site/css/*.css'], ['styles']);
  gulp.watch(['site/js/*.js'], ['js']);
  gulp.watch(['site/*.html'], ['html']);
});

gulp.task('build', function(done) {
  sequence(
    ['html', 'js', 'styles'],
    'browser-sync',
    done);
});


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

Upvotes: 2

Views: 473

Answers (1)

Guille
Guille

Reputation: 652

The issue was that I didn't have a body tag in my index file. Once I added it, atom stopped refreshing and browser-sync started working properly

Upvotes: 0

Related Questions