#77 fix caching for style dependencies

merkle-open · Jun 10, 2016 · 22e83ea · 22e83ea
1 parent 5262db9
commit 22e83ea
Show file tree

Hide file tree

Showing 6 changed files with 60 additions and 25 deletions.
diff --git a/app/templates/gulp/compile-css.js b/app/templates/gulp/compile-css.js
@@ -7,7 +7,7 @@ var autoprefixer = require('autoprefixer');
 
 module.exports = function (gulp, plugins) {
 	return function () {
-		var assets = utils.getSourceFiles('.css');
+		var assets = utils.getSourcePatterns('css');
 		var promises = [];
 		var browserCompatibility = utils.getBrowserCompatibility();
 

diff --git a/app/templates/gulp/compile-js.js b/app/templates/gulp/compile-js.js
@@ -4,7 +4,7 @@ var browserSync = utils.getBrowserSyncInstance();
 
 module.exports = function (gulp, plugins) {
 	return function () {
-		var assets = utils.getSourceFiles('.js');
+		var assets = utils.getSourcePatterns('js');
 		var promises = [];
 
 		assets.forEach(function (asset) {

diff --git a/app/templates/gulp/minify-css.js b/app/templates/gulp/minify-css.js
@@ -2,7 +2,7 @@ var utils = require('./utils');
 
 module.exports = function (gulp, plugins) {
 	return function () {
-		var assets = utils.getSourceFiles('.css');
+		var assets = utils.getSourcePatterns('css');
 
 		assets.forEach(function (asset) {
 			gulp

diff --git a/app/templates/gulp/minify-js.js b/app/templates/gulp/minify-js.js
@@ -2,7 +2,7 @@ var utils = require('./utils');
 
 module.exports = function (gulp, plugins) {
 	return function () {
-		var assets = utils.getSourceFiles('.js');
+		var assets = utils.getSourcePatterns('js');
 
 		assets.forEach(function (asset) {
 			gulp

diff --git a/app/templates/gulp/utils.js b/app/templates/gulp/utils.js
@@ -3,6 +3,7 @@ var path = require('path');
 var gulp = require('gulp');
 var plugins = require('gulp-load-plugins')();
 var browserSync;
+var assets = {};
 
 function getBrowserCompatibility() {
 	return cfg.code.compatibility.browsers;
@@ -16,35 +17,52 @@ function getBrowserSyncInstance() {
 	return browserSync;
 }
 
-function getSourceFiles(ext) {
-	var assets = [];
+function getSourcePatterns(ext) {
 
-	for (var key in cfg.assets) {
-		if (cfg.assets.hasOwnProperty(key) && ext === path.extname(key)) {
-			var asset = cfg.assets[key],
+	var type = typeof ext === 'string' && ( ext === 'js' || ext === 'css' ) ? ext : null;
+
+	if (!assets.hasOwnProperty('js') || !assets.hasOwnProperty('css')) {
+		updateSourcePatterns();
+	}
+
+	return type ?  assets[type] : assets;
+}
+
+function updateSourcePatterns() {
+	var key, ext, type, asset, result, patternKey, patternPath;
+
+	assets = {
+		css: [],
+		js: []
+	};
+
+	for (key in cfg.assets) {
+		if (cfg.assets.hasOwnProperty(key)) {
+			ext = path.extname(key);
+			if (ext) {
+				type = ext.replace(/[^a-z]/g, '');
+				asset = cfg.assets[key];
 				result = {
 					name: key,
 					deps: [],
 					src:  []
 				};
 
-			for (var fkey in asset) {
-				if (asset.hasOwnProperty(fkey)) {
-					var filepath = asset[fkey];
-					if (filepath.indexOf('+') === 0) {
-						result.deps.push(filepath.substr(1));
-					}
-					else {
-						result.src.push(filepath);
+				for (patternKey in asset) {
+					if (asset.hasOwnProperty(patternKey)) {
+						patternPath = asset[patternKey];
+						if (patternPath.indexOf('+') === 0) {
+							result.deps.push(patternPath.substr(1));
+						}
+						else {
+							result.src.push(patternPath);
+						}
 					}
 				}
+				assets[type].push(result);
 			}
-
-			assets.push(result);
 		}
 	}
-
-	return assets;
 }
 
 function getTask(task) {
@@ -79,7 +97,8 @@ function splitJsAssets(asset) {
 module.exports = {
 	getBrowserCompatibility: getBrowserCompatibility,
 	getBrowserSyncInstance: getBrowserSyncInstance,
-	getSourceFiles: getSourceFiles,
+	getSourcePatterns: getSourcePatterns,
+	updateSourcePatterns: updateSourcePatterns,
 	getTask: getTask,
 	reloadConfig: reloadConfig<% if (options.js === 'TypeScript') { %>,
 	splitJsAssets: splitJsAssets<% } %>

diff --git a/app/templates/gulp/watch-assets.js b/app/templates/gulp/watch-assets.js
@@ -1,19 +1,34 @@
 var cfg = require('../app/core/config');
 var utils = require('./utils');
+var globby = require('globby');
 var browserSync = utils.getBrowserSyncInstance();
 
 module.exports = function (gulp, plugins) {
 	return function () {
+		var isDependentStyleSource = function(file) {
+			var isDependent = false;
+			var cssAssets = utils.getSourcePatterns('css');
+			cssAssets.forEach(function (asset) {
+				globby.sync(asset.deps).forEach(function (path) {
+					if ( file.replace(/\\/g, '/').endsWith(path) ) {
+						isDependent = true;
+					}
+				});
+			});
+
+			return isDependent;
+		};
 		var clearCache = function (e) {
 			if (
 				'unlink' === e.event ||
 				'add' === e.event ||
-				e.path.endsWith('config.json')
+				e.path.endsWith('config.json') ||
+				isDependentStyleSource(e.path)
 			) {
 				// forget all
 				plugins.cached.caches = {};
-				var assets = utils.getSourceFiles('.css');
-				assets.forEach(function (asset) {
+				var cssAssets = utils.getSourcePatterns('css');
+				cssAssets.forEach(function (asset) {
 					if (plugins.remember.cacheFor(asset.name)) {
 						plugins.remember.forgetAll(asset.name);
 					}
@@ -26,6 +41,7 @@ module.exports = function (gulp, plugins) {
 		], function (e) {
 			cfg = utils.reloadConfig();
 			clearCache(e);
+			utils.updateSourcePatterns();
 			gulp.start('compile-css');
 			gulp.start('compile-js');
 		});