Merge pull request #183 from jakemmarsh/fix-bundle-logger

Code cleanup, use bundleLogger

Author: jakemmarsh

gulp/tasks/browserify.js

@@ -1,9 +1,7 @@
 'use strict';
 
-import config       from '../config';
 import gulp         from 'gulp';
 import gulpif       from 'gulp-if';
-import gutil        from 'gulp-util';
 import source       from 'vinyl-source-stream';
 import sourcemaps   from 'gulp-sourcemaps';
 import buffer       from 'vinyl-buffer';
@@ -12,21 +10,21 @@ import watchify     from 'watchify';
 import browserify   from 'browserify';
 import babelify     from 'babelify';
 import uglify       from 'gulp-uglify';
-import handleErrors from '../util/handleErrors';
 import browserSync  from 'browser-sync';
 import debowerify   from 'debowerify';
 import ngAnnotate   from 'browserify-ngannotate';
-
-function createSourcemap() {
-  return !global.isProd || config.browserify.prodSourcemap;
-}
+import handleErrors from '../util/handleErrors';
+import bundleLogger from '../util/bundleLogger';
+import config       from '../config';
 
 // Based on: http://blog.avisi.nl/2014/04/25/how-to-keep-a-fast-build-with-browserify-and-reactjs/
 function buildScript(file) {
 
+  const shouldCreateSourcemap = !global.isProd || config.browserify.prodSourcemap;
+
   let bundler = browserify({
     entries: [config.sourceDir + 'js/' + file],
-    debug: createSourcemap(),
+    debug: shouldCreateSourcemap,
     cache: {},
     packageCache: {},
     fullPaths: !global.isProd
@@ -35,10 +33,7 @@ function buildScript(file) {
   if ( !global.isProd ) {
     bundler = watchify(bundler);
 
-    bundler.on('update', function() {
-      rebundle();
-      gutil.log('Rebundle...');
-    });
+    bundler.on('update', rebundle);
   }
 
   const transforms = [
@@ -54,17 +49,21 @@ function buildScript(file) {
   });
 
   function rebundle() {
+    bundleLogger.start();
+
     const stream = bundler.bundle();
     const sourceMapLocation = global.isProd ? './' : '';
 
-    return stream.on('error', handleErrors)
+    return stream
+      .on('error', handleErrors)
+      .on('end', bundleLogger.end)
       .pipe(source(file))
-      .pipe(gulpif(createSourcemap(), buffer()))
-      .pipe(gulpif(createSourcemap(), sourcemaps.init({ loadMaps: true })))
+      .pipe(gulpif(shouldCreateSourcemap, buffer()))
+      .pipe(gulpif(shouldCreateSourcemap, sourcemaps.init({ loadMaps: true })))
       .pipe(gulpif(global.isProd, streamify(uglify({
         compress: { drop_console: true } // eslint-disable-line camelcase
       }))))
-      .pipe(gulpif(createSourcemap(), sourcemaps.write(sourceMapLocation)))
+      .pipe(gulpif(shouldCreateSourcemap, sourcemaps.write(sourceMapLocation)))
       .pipe(gulp.dest(config.scripts.dest))
       .pipe(browserSync.stream());
   }

gulp/util/bundleLogger.js

@@ -1,26 +1,21 @@
 'use strict';
 
-/* bundleLogger
- * ------------
- * Provides gulp style logs to the bundle method in browserify.js
- */
-
 import gutil        from 'gulp-util';
 import prettyHrtime from 'pretty-hrtime';
 
-var startTime;
+let startTime;
 
 export default {
 
   start() {
     startTime = process.hrtime();
-    gutil.log('Running', gutil.colors.green('\'bundle\'') + '...');
+    gutil.log(`${gutil.colors.green('Rebundling')}...`);
   },
 
   end() {
-    var taskTime = process.hrtime(startTime);
-    var prettyTime = prettyHrtime(taskTime);
-    gutil.log('Finished', gutil.colors.green('\'bundle\''), 'in', gutil.colors.magenta(prettyTime));
+    const taskTime = process.hrtime(startTime);
+    const prettyTime = prettyHrtime(taskTime);
+    gutil.log(`Finished ${gutil.colors.green('rebundling')} in ${gutil.colors.magenta(prettyTime)}`);
   }
 
-};
+};

gulp/util/handleErrors.js

@@ -1,12 +1,13 @@
 'use strict';
 
+import gutil  from 'gulp-util';
 import notify from 'gulp-notify';
 
 export default function(error) {
 
   if( !global.isProd ) {
 
-    var args = Array.prototype.slice.call(arguments);
+    const args = Array.prototype.slice.call(arguments);
 
     // Send error to notification center with gulp-notify
     notify.onError({
@@ -20,8 +21,8 @@ export default function(error) {
   } else {
     // Log the error and stop the process
     // to prevent broken code from building
-    console.log(error);
+    gutil.log(gutil.colors.red(error));
     process.exit(1);
   }
 
-};
+};

package.json

@@ -1,6 +1,6 @@
 {
   "name": "angularjs-gulp-browserify-boilerplate",
-  "version": "1.5.7",
+  "version": "1.5.8",
   "author": "Jake Marsh <[email protected]>",
   "description": "Boilerplate using AngularJS, SASS, Gulp, and Browserify while also utilizing best practices.",
   "repository": {