📦 NEW: BrowserSync

MaedahBatool · Jul 6, 2018 · c64cca1 · c64cca1
1 parent 0db6278
commit c64cca1
Show file tree

Hide file tree

Showing 3 changed files with 2,081 additions and 13 deletions.
diff --git a/gulpfile.js b/gulpfile.js
@@ -11,12 +11,14 @@ const config = {
 	scssSrc: './scss/style.scss',
 	scssDst: './',
 	pugWatchFiles: './views/**/*.pug',
-	scssWatchFiles: './scss/**/*.scss'
+	scssWatchFiles: './scss/**/*.scss',
+	browserSyncWatchFiles: './'
 };
 
 const gulp = require('gulp');
 const pug = require('gulp-pug');
 const sass = require('gulp-sass');
+const browserSync = require('browser-sync').create();
 
 /**
  * Pug
@@ -45,7 +47,33 @@ gulp.task('scss', function() {
 /**
  * Default
  */
-gulp.task('default', ['pug', 'scss'], function() {
+gulp.task('default', ['pug', 'scss', 'browser-sync'], function() {
 	gulp.watch(config.pugWatchFiles, ['pug']);
 	gulp.watch(config.scssWatchFiles, ['scss']);
+	gulp.watch(config.browserSyncWatchFiles, ['browser-sync']);
+});
+
+/**
+ * BrowserSync Init
+ *
+ */
+gulp.task('browser-sync', function() {
+	browserSync.init({
+		server: {
+			baseDir: './'
+		}
+	});
+});
+
+/**
+ * BrowserSync Watch SCSS Files
+ *
+ */
+gulp.task('serve', ['sass'], function() {
+	browserSync.init({
+		server: './scss'
+	});
+
+	gulp.watch('/scss/*.scss', ['sass']);
+	gulp.watch('scss/*.html').on('change', browserSync.reload);
 });