Introduce gulp watch script

gulpfile.js

@@ -4,6 +4,9 @@ const useref = require('gulp-useref');
 const replace = require('gulp-replace');
 const cachebust = require('gulp-cache-bust');
 const minify = require('gulp-minify');
+const browserSync = require("browser-sync");
+
+const server = browserSync.create();
 
 gulp.task('css', function () {
   return gulp.src('src/css/*.css')
@@ -78,4 +81,32 @@ gulp.task('build',
       'shapelib',
       'canvg'
   )
-);
+);
+
+gulp.task('serve', function () {
+  server.init({
+    server: {
+      baseDir: './dist',
+    },
+  });
+});
+
+gulp.task('reload', function (done) {
+  server.reload();
+  done();
+});
+
+gulp.task('watch', function () {
+  gulp.watch('src/css/*.css', gulp.series('css', 'reload'));
+  gulp.watch(['src/js/*.js', 'src/lib/*.js'], gulp.series('js', 'reload'));
+  gulp.watch('src/js/loading.js', gulp.series('loading', 'reload'));
+  gulp.watch('src/*.html', gulp.series('index', 'reload'));
+  gulp.watch('src/site.webmanifest', gulp.series('manifest', 'reload'));
+  gulp.watch('src/images/**/*', gulp.series('images', 'reload'));
+  gulp.watch('src/font-files/**/*', gulp.series('fonts', 'reload'));
+  gulp.watch('src/extensions/**/*', gulp.series('extensions', 'reload'));
+  gulp.watch('src/shapelib/**/*', gulp.series('shapelib', 'reload'));
+  gulp.watch(['src/js/lib/canvg.js', 'src/js/lib/rgbcolor.js'], gulp.series('canvg', 'reload'));
+});
+
+gulp.task('dev', gulp.series('build', gulp.parallel('watch', 'serve')));

package.json

@@ -8,6 +8,8 @@
     "test": "test"
   },
   "scripts": {
+    "build": "gulp build",
+    "dev": "gulp dev",
     "test": "test"
   },
   "repository": {
@@ -26,6 +28,7 @@
   },
   "homepage": "https://github.com/methodofaction/Method-Draw#readme",
   "devDependencies": {
+    "browser-sync": "2.27.4",
     "gulp": "^4.0.2",
     "gulp-cache-bust": "^1.4.1",
     "gulp-concat": "^2.6.1",

readme.md

@@ -28,6 +28,12 @@ cd src
 python -m http.server 8000
 ```
 
+or using npm:
+
+```sh
+npm run dev
+```
+
 ## Build
 
 Install dev dependencies:
@@ -36,7 +42,7 @@ Install dev dependencies:
 
 Then you can build into `dist` by running:
 
-`gulp build`
+`npm run build`
 
 Deploy `dist` to your static file server of choice.