Concat JS in components folders to components.js

Author: ryanowich

gulpfile.js

@@ -6,7 +6,8 @@
 var settings = {
 	clean: true,
 	scripts: true,
-	polyfills: true,
+  componentScripts: true,
+	polyfills: false,
 	styles: true,
   templates: true,
 	svgs: true,
@@ -25,6 +26,7 @@ var paths = {
 	scripts: {
 		input: 'src/js/*',
 		polyfills: '.polyfill.js',
+    components: 'src/components/**/*.js',
 		output: 'dist/js/'
 	},
 	styles: {
@@ -203,14 +205,28 @@ var buildScripts = function (done) {
 
 };
 
+// Concat JS in components
+var concatComponentScripts = function (done) {
+  
+  if (!settings.componentScripts) return done();
+  
+  // Run tasks on JS files in components folders
+  return src(paths.scripts.components)
+    .pipe(sourcemaps.init())
+    .pipe(concat('components.js'))
+    .pipe(sourcemaps.write('.'))
+    .pipe(dest(paths.scripts.output));
+};
+
+
 // Lint scripts
 var lintScripts = function (done) {
 
 	// Make sure this feature is activated before running
 	if (!settings.scripts) return done();
 
 	// Lint scripts
-	return src(paths.scripts.input)
+	return src([paths.scripts.input, paths.scripts.components])
 		.pipe(jshint())
 		.pipe(jshint.reporter('jshint-stylish'));
 
@@ -337,6 +353,7 @@ exports.default = series(
 	cleanDist,
 	parallel(
 		buildScripts,
+    concatComponentScripts,
 		lintScripts,
 		buildStyles,
     buildTemplates,

src/components/list/_list.scss

@@ -1 +1 @@
-console.log('List is here.')
+console.log('List is here.');

src/components/list/list.js

@@ -0,0 +1,3 @@
+ul {
+  background-color: lightgreen;
+}

src/components/list/list.scss

@@ -1,7 +1,3 @@
-<pre>List 1</pre>
-
-{{ testvar }}
-
 <ul>
   {% for item in index %}
     <li>{{ item.name }}</li>

src/components/list/list.twig

@@ -0,0 +1 @@
+console.log('More code!');

src/js/main/more-code.js

@@ -18,6 +18,7 @@
 
 	<script src="js/detects.js"></script>
 	<script src="js/another-file.js"></script>
-	<script src="js/main.polyfills.js"></script>
+	<script src="js/main.js"></script>
+  <script src="js/components.js"></script>
 </body>
 </html>