further improvements to the flow, allow multiple js bundles, add more documentation

config.barebones.js

@@ -1,8 +1,8 @@
 /**
  * Base config
  *
- * src - main assets folder
- * public - folder where assets should be compiled
+ * @param src - Main assets folder
+ * @param public - Folder where assets should be compiled
  */
 const config = {
   src: './assets',
@@ -14,8 +14,8 @@ const config = {
  *
  * For scripts and styles, each file will be a separate bundle
  *
- * base - base configuration
- * scripts - array of script files to create bundles from
+ * @param base - Base configuration
+ * @param scripts - Array of script files to create bundles from
  */
 export default {
   /**
@@ -25,9 +25,11 @@ export default {
 
   /**
    * Scripts
+   *
+   * Add path cotinuing after 'config.src'
    */
   scripts: [
-    `${config.src}/scripts/scripts.js`,
+    '/js/scripts.js',
   ],
 
   /**

functions.php

@@ -61,7 +61,7 @@ function barebones_enqueue_scripts()
 {
     // wp_enqueue_style( 'fonts', '//fonts.googleapis.com/css?family=Font+Family' );
     // wp_enqueue_style( 'icons', '//maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css' );
-    wp_enqueue_script('script', get_stylesheet_directory_uri() . '/js/script.min.js?' . filemtime(get_stylesheet_directory() . '/js/script.min.js'), [], null, true);
+    wp_enqueue_script('scripts', get_stylesheet_directory_uri() . '/js/scripts.min.js?' . filemtime(get_stylesheet_directory() . '/js/scripts.min.js'), [], null, true);
 }
 add_action('wp_enqueue_scripts', 'barebones_enqueue_scripts');
 

gulpfile.babel.js

@@ -31,7 +31,7 @@ let error = false;
 /**
  * Tasks - in order
  */
-const tasks = ['clean', 'styles', 'scripts', 'images'];
+const tasks = ['styles', 'scripts', 'images'];
 
 /**
  * Notification
@@ -78,14 +78,14 @@ gulp.task('styles', () => (
     .pipe(gulp.dest(`${config.base.public}/css`))
 ));
 
-gulp.task('scripts', () => {
+const roll = (entry, dest) => {
   let env = 'development';
   if (production) {
     env = 'production';
   }
 
-  rollup({
-    entry: `${config.base.src}/scripts/scripts.js`,
+  return rollup({
+    entry,
     plugins: [
       multiEntry(),
       buble(),
@@ -111,13 +111,26 @@ gulp.task('scripts', () => {
       format: 'iife',
       moduleName: 'BarebonesBundle',
       sourceMap: !production,
-      dest: `${config.base.public}/js/script.min.js`,
+      dest,
     });
   }).catch((err) => {
     notification('Failed to compile scripts. 😱', 'error');
     log(err.stack);
     error = true;
   });
+};
+
+gulp.task('scripts', (cb) => {
+  if (config.scripts.length) {
+    config.scripts.forEach((filePath) => {
+      const formattedPath = filePath.replace(/^\/|\/$/g, ''); // remove leading forward slash
+      const entry = `${config.base.src}/${formattedPath}`;
+      const dest = `${config.base.public}/${formattedPath.replace('.js', '.min.js')}`;
+      // regex to remove duplicate forward slashes
+      roll(entry.replace(/([^:]\/)\/+/g, '$1'), dest.replace(/([^:]\/)\/+/g, '$1'));
+    });
+  }
+  cb();
 });
 
 /**
@@ -132,7 +145,7 @@ gulp.task('watch-files', tasks, () => {
 /**
  * Images
  */
-gulp.task('images', () => {
+gulp.task('images', (cb) => {
   // hadle all images that are not svg
   gulp.src(`${config.base.src}/images/**/*.*`)
     .pipe(imagemin({
@@ -141,29 +154,41 @@ gulp.task('images', () => {
         removeViewBox: false,
       }],
     }))
-    .pipe(gulp.dest(`${config.base.public}/img`));
+    .pipe(gulp.dest(`${config.base.public}/img`))
+    .on('end', () => cb());
 });
 
 /**
  * Main Tasks
  */
-gulp.task('watch', () => (
+gulp.task('watch', cb => (
+  runSequence('clean', () => {
     runSequence(tasks, 'watch-files', () => {
       if (!error) {
         notification('Watching files... 👀');
       }
+      cb();
+    });
   })
 ));
 
-gulp.task('build', () => {
+gulp.task('build', (cb) => {
   production = true;
+
+  runSequence('clean', () => {
     runSequence(tasks, () => {
       if (!error) {
         notification('Build complete! 🍻');
+        cb();
       }
     });
+  });
 });
 
-gulp.task('default', () => (
-  runSequence(tasks)
+gulp.task('default', cb => (
+  runSequence('clean', () => {
+    runSequence(tasks, () => {
+      cb();
+    });
+  })
 ));