Added browser-sync

gulpfile.js

@@ -3,12 +3,16 @@ var gulp = require('gulp'),
     postcss = require('gulp-postcss'),
     autoprefixer = require("autoprefixer"),
     cssnano = require("cssnano"),
-    sourcemaps = require("gulp-sourcemaps");
+    sourcemaps = require("gulp-sourcemaps"),
+    browserSync = require("browser-sync").create();
 
 var paths = {
     styles: {
         src: "src/**/*.scss",
         dest: "dist"
+    },
+    html: {
+        src: "index.html"
     }
 }
 
@@ -21,14 +25,28 @@ function style() {
             .pipe(postcss([autoprefixer(), cssnano()]))
             .pipe(sourcemaps.write())
             .pipe(gulp.dest(paths.styles.dest))
+            .pipe(browserSync.stream())
     );
 }
 
 exports.style = style;
 
+function reload(){
+    browserSync.reload();
+}
+
 function watch() {
     style();
-    gulp.watch(paths.styles.src, style)
+
+    browserSync.init({
+        server: {
+            baseDir: "./",
+        },
+        startPath: "index.html"
+    })
+
+    gulp.watch(paths.styles.src, style);
+    gulp.watch(paths.html.src, reload)
 }
 
 exports.watch = watch;

package.json

@@ -26,6 +26,7 @@
   "devDependencies": {},
   "dependencies": {
     "autoprefixer": "^9.5.1",
+    "browser-sync": "^2.26.3",
     "cssnano": "^4.1.10",
     "gulp": "^4.0.0",
     "gulp-postcss": "^8.0.0",