title: browser-sync gulp config
body: <p>I am trying to improve my Gulp configuration to include browser sync. I currently use MAMP Pro using <code>local.domain.com</code> for each site I'm working on (WordPress sites). </p>
  
  <p>I'd like to get <code>browser-sync</code> to work using this current setup (watches my SASS files and minifies CSS when using watch).</p>
  
  <p>I cannot seem to work out how to get browser sync to work with using the domain in my MAMP Pro setup.</p>
  
  <pre><code>// Include gulp
  var gulp = require('gulp'); 
  
  // Include Our Plugins
  var jshint = require('gulp-jshint');
  var sass = require('gulp-sass');
  var cssnano = require('gulp-cssnano');
  var concat = require('gulp-concat');
  var uglify = require('gulp-uglify');
  var rename = require('gulp-rename');
  var uglifycss = require('gulp-uglifycss');
  
  // Lint Task
  gulp.task('lint', function() {
      return gulp.src('js/*.js')
          .pipe(jshint())
          .pipe(jshint.reporter('default'));
  });
  
  // Compile Our Sass
  gulp.task('sass', function() {
      return gulp.src('lib/themes/domain/styles/*.scss')
          .pipe(sass())
          .pipe(gulp.dest('lib/themes/domain/'));
  });
  
  // Concatenate &amp; Minify JS
  gulp.task('scripts', function() {
      return gulp.src('js/*.js')
          .pipe(concat('all.js'))
          .pipe(gulp.dest('dist'))
          .pipe(rename('all.min.js'))
          .pipe(uglify())
          .pipe(gulp.dest('dist'));
  });
  
  
  
  
  
  gulp.task('uglify', function () {
    gulp.src('lib/themes/domain/style.css')
      .pipe(uglifycss({
        "max-line-len": 80
      }))
      .pipe(gulp.dest('lib/themes/domain/'));
  });
  
  
  
  
  // Watch Files For Changes
  gulp.task('watch', function() {
      gulp.watch('js/*.js', ['lint', 'sass', 'scripts', 'uglify']);
      gulp.watch('lib/themes/domain/styles/*/*.scss', ['sass']);
      gulp.watch('lib/themes/domain/styles/*.scss', ['sass']);
      gulp.watch('lib/themes/domain/style.css', ['uglify']);
  });
  
  // Default Task
  gulp.task('default', ['lint', 'sass', 'uglify', 'scripts', 'watch']);
  </code></pre>