add support for additional styles outside of assets folder

assets/js/scripts.js

@@ -5,9 +5,9 @@ import $ from 'jquery';
  * @param  {mixed} event
  */
 const toggleMenu = (event) => {
-    event.preventDefault();
+  event.preventDefault();
-    $('.js-menu-toggle, .nav--header').toggleClass('open');
+  $('.js-menu-toggle, .nav--header').toggleClass('open');
-    $('.header').toggleClass('menu-open');
+  $('.header').toggleClass('menu-open');
 };
 $('.js-menu-toggle').on('click', toggleMenu);
 

config.barebones.js

@@ -1,14 +1,3 @@
-/**
- * Base config
- *
- * @param src - Main assets folder
- * @param public - Folder where assets should be compiled
- */
-const config = {
-  src: './assets',
-  public: './',
-};
-
 /**
  * Export configuration that is used in gulpfile
  *
@@ -21,7 +10,10 @@ export default {
   /**
    * Base
    */
-  base: config,
+  base: {
+    src: './assets',
+    public: './',
+  },
 
   /**
    * Scripts
@@ -31,4 +23,13 @@ export default {
   scripts: [
     '/js/scripts.js',
   ],
+
+  /**
+   * Additional styles
+   *
+   * For external stylesheets most likely outside of assets folder
+   */
+  styles: [
+    // './example.scss', - in the root barebones folder
+  ],
 };

gulpfile.babel.js

@@ -25,7 +25,7 @@ import path from 'path';
 import config from './config.barebones';
 
 const { log } = console;
-let production = false;
+let production = false; // = build
 let error = false;
 
 /**
@@ -58,8 +58,14 @@ gulp.task('clean', () => (
     .pipe(clean())
 ));
 
-gulp.task('styles', () => (
+/**
-  gulp.src(`${config.base.src}/styles/*.scss`)
+ * Styles
+ */
+gulp.task('styles', () => {
+  const stylesheets = config.styles;
+  stylesheets.push(`${config.base.src}/styles/*.scss`);
+
+  gulp.src(stylesheets)
     .pipe(gulpif(!production, sourcemaps.init()))
     .pipe(sass({
       outputStyle: production ? 'compressed' : 'nested',
@@ -75,8 +81,8 @@ gulp.task('styles', () => (
       suffix: '.min',
     }))
     .pipe(gulpif(!production, sourcemaps.write('.')))
-    .pipe(gulp.dest(`${config.base.public}/css`))
+    .pipe(gulp.dest(`${config.base.public}/css`));
-));
+});
 
 const roll = (entry, dest) => {
   let env = 'development';