Refactor build watching

tgui/gulp/plugins.js

@@ -3,7 +3,8 @@ export const browserify = {
   collapse: require('bundle-collapser/plugin'),
   componentify: require('ractive-componentify'),
   globify: require('require-globify'),
-  helpers: require('babelify-external-helpers')
+  helpers: require('babelify-external-helpers'),
+  rememberify: require('rememberify')
 }
 
 export const gulp = require('gulp-load-plugins')({replaceString: /^gulp(-|\.)|-/g})

tgui/gulp/tasks/build.js

@@ -1,5 +1,5 @@
-import css from './css'
-import js from './js'
+import { css } from './css'
+import { js } from './js'
 import size from './size'
 
 import gulp from 'gulp'

tgui/gulp/tasks/css.js

@@ -3,7 +3,7 @@ import * as p from '../paths'
 import { gulp as g, postcss as s } from '../plugins'
 
 import gulp from 'gulp'
-module.exports = function () {
+export function css () {
   return gulp.src(p.css.dir + p.css.main)
     .pipe(g.if(f.debug, g.sourcemaps.init({loadMaps: true})))
     .pipe(g.stylus({ url: 'data-url', paths: [p.img.dir] }))
@@ -19,4 +19,6 @@ module.exports = function () {
     .pipe(g.bytediff.stop())
     .pipe(gulp.dest(p.out))
 }
-module.exports.displayName = 'css'
+export function watch_css () {
+  return gulp.watch(p.css.dir + '**', css)
+}

tgui/gulp/tasks/js.js

@@ -16,29 +16,27 @@ b.componentify.compilers['text/javascript'] = function (source, file) {
 }
 
 import browserify from 'browserify'
-import through from 'through2'
-const bundle = function () {
-  return through.obj((file, enc, next) => {
-    const bundle = browserify(file.path, { extensions: ['.js', '.ract'], debug: f.debug })
-      .transform(b.babelify)
-      .plugin(b.helpers)
-      .transform(b.componentify)
-      .transform(b.globify)
-    if (f.min) {
-      bundle.plugin(b.collapse)
-    }
-    bundle.bundle((err, res) => {
-      if (err) next(err)
-      file.contents = res
-      next(null, file)
-    })
+const bundle = browserify(p.js.dir + p.js.main, {
+    debug: f.debug,
+    cache: {},
+    extensions: ['.js', '.ract']
   })
+  .plugin(b.rememberify)
+  .transform(b.babelify)
+  .plugin(b.helpers)
+  .transform(b.componentify)
+  .transform(b.globify)
+if (f.min) {
+  bundle.plugin(b.collapse)
 }
 
+import buffer from 'vinyl-buffer'
 import gulp from 'gulp'
-module.exports = function () {
-  return gulp.src(p.js.dir + p.js.main)
-    .pipe(bundle())
+import source from 'vinyl-source-stream'
+export function js () {
+  return bundle.bundle()
+    .pipe(source('bundle'))
+    .pipe(buffer())
     .pipe(g.if(f.debug, g.sourcemaps.init({loadMaps: true})))
     .pipe(g.rename(p.js.out))
     .pipe(g.bytediff.start())
@@ -47,4 +45,9 @@ module.exports = function () {
     .pipe(g.bytediff.stop())
     .pipe(gulp.dest(p.out))
 }
-module.exports.displayName = 'js'
+export function watch_js () {
+  return gulp.watch(p.js.dir + '**', vinyl => {
+    b.rememberify.forget(bundle, vinyl.path)
+    return js()
+  })
+}

tgui/gulp/tasks/watch.js

@@ -1,15 +1,8 @@
 import * as p from '../paths'
 
-import build from './build'
-import clean from './clean'
-import reload from './reload'
+import { watch_css } from './css'
+import { watch_js } from './js'
 
-import debounce from 'debounce'
 import gulp from 'gulp'
-module.exports = function () {
-  return gulp.watch(
-    Object.keys(p).filter((path) => p[path].dir).map((path) => p[path].dir + '**'),
-    debounce(gulp.series(clean, build, reload), 1000)
-  )
-}
+module.exports = gulp.parallel(watch_css, watch_js)
 module.exports.displayName = 'watch'

tgui/package.json

@@ -12,7 +12,6 @@
     "babelify-external-helpers": "~1.1.0",
     "browserify": "~12.0.1",
     "bundle-collapser": "~1.2.1",
-    "debounce": "~1.0.0",
     "del": "~2.2.0",
     "dom4": "~1.6.0",
     "gulp": "github:gulpjs/gulp#4.0",
@@ -34,8 +33,10 @@
     "ractive-componentify": "~0.2.2",
     "ractive-events-keys": "~0.2.1",
     "ractive-transitions-fade": "~0.3.1",
+    "rememberify": "~1.0.1",
     "require-globify": "~1.3.0",
-    "through2": "~2.0.0",
+    "vinyl-buffer": "~1.0.0",
+    "vinyl-source-stream": "~1.1.0",
     "webfontloader": "~1.6.20"
   },
   "browser": {