browser-sync gulp config

Question

Ich versuche meine Gulp-Konfiguration zu verbessern, um die Browser-Synchronisierung einzuschließen. Ich benutze derzeit MAMP Pro mit local.domain.com für jede Site, an der ich arbeite (WordPress-Sites).

Ich möchte browser-sync zu arbeiten mit dieser aktuellen Setup (beobachtet meine SASS-Dateien und minimiert CSS bei der Verwendung von Uhr).

Ich kann nicht herausfinden, wie Browsersynchronisierung mit der Domäne in meinem MAMP Pro-Setup funktioniert.

Answer 1

Ich werde den Code für Sie nicht schreiben, stattdessen zeige ich Ihnen, wie ich es gerne mache. Ich führe meine Browser-Synchronisierung in einer separaten Aufgabe aus, schaue einfach deine Build-Dateien nach Änderungen an.

var browserSync = require('browser-sync').create(); 
 
var urlPath = "your-url.com"; 
 

 
gulp.task('browser-sync', function (cb) { 
 
    browserSync.init({ 
 
     proxy: urlPath, 
 
    }, function() { 
 
     gulp.watch("Views/**/*.cshtml").on("change", browserSync.reload); 
 
     gulp.watch('Assets/build/scripts/**/*.js').on('change', browserSync.reload); 
 
     gulp.watch('Assets/build/styles/**/*.css').on('change', function() { 
 
      gulp.src('Assets/build/styles/**/*.css') 
 
      .pipe(browserSync.stream()); 
 
     }); 
 
     cb(); 
 
    }); 
 
});