Merge pull request #1914 from crazyserver/MOBILE-3031

MOBILE-3031 gulp: Add combine scss task

gulpfile.js

@@ -8,6 +8,8 @@ var gulp = require('gulp'),
     gutil = require('gulp-util'),
     flatten = require('gulp-flatten'),
     npmPath = require('path'),
+    concat = require('gulp-concat'),
+    bufferFrom = require('buffer-from')
     File = gutil.File,
     exec = require('child_process').exec,
     license = '' +
@@ -113,7 +115,7 @@ function treatMergedData(data) {
         mergedOrdered[k] = merged[k];
     });
 
-    return new Buffer(JSON.stringify(mergedOrdered, null, 4));
+    return bufferFrom(JSON.stringify(mergedOrdered, null, 4));
 }
 
 /**
@@ -257,7 +259,7 @@ gulp.task('config', function(done) {
 
                 contents += '}\n';
 
-                file.contents = new Buffer(contents);
+                file.contents = bufferFrom(contents);
                 this.emit('data', file);
             }))
             .pipe(rename('configconstants.ts'))
@@ -296,3 +298,129 @@ gulp.task('copy-component-templates', function(done) {
         .on('end', done);
 });
 
+/**
+ * Finds the file and returns its content.
+ *
+ * @param  {string} capture     Import file path.
+ * @param  {string} baseDir     Directory where the file was found.
+ * @param  {string} paths       Alternative paths where to find the imports.
+ * @param  {Array} parsedFiles  Yet parsed files to reduce size of the result.
+ * @return {string}             Partially combined scss.
+ */
+function getReplace(capture, baseDir, paths, parsedFiles) {
+    var parse   = path.parse(path.resolve(baseDir, capture + '.scss'));
+    var file    = parse.dir + '/' + parse.name;
+
+
+    if (!fs.existsSync(file + '.scss')) {
+        // File not found, might be a partial file.
+        file    = parse.dir + '/_' + parse.name;
+    }
+
+    // If file still not found, try to find the file in the alternative paths.
+    var x = 0;
+    while (!fs.existsSync(file + '.scss') && paths.length > x) {
+        parse   = path.parse(path.resolve(paths[x], capture + '.scss'));
+        file    = parse.dir + '/' + parse.name;
+
+        x++;
+    }
+
+    file    = file + '.scss';
+
+    if (!fs.existsSync(file)) {
+        // File not found. Leave the import there.
+        console.log('File "' + capture + '" not found');
+        return '@import "' + capture + '";';
+    }
+
+    if (parsedFiles.indexOf(file) >= 0) {
+        console.log('File "' + capture + '" already parsed');
+        // File was already parsed, leave the import commented.
+        return '// @import "' + capture + '";';
+    }
+
+    parsedFiles.push(file);
+    var text = fs.readFileSync(file);
+
+    // Recursive call.
+    return scssCombine(text, parse.dir, paths, parsedFiles);
+}
+
+/**
+ * Combine scss files with its imports
+ *
+ * @param  {string} content     Scss string to read.
+ * @param  {string} baseDir     Directory where the file was found.
+ * @param  {string} paths       Alternative paths where to find the imports.
+ * @param  {Array} parsedFiles  Yet parsed files to reduce size of the result.
+ * @return {string}             Scss string with the replaces done.
+ */
+function scssCombine(content, baseDir, paths, parsedFiles) {
+
+    // Content is a Buffer, convert to string.
+    if (typeof content != "string") {
+        content = content.toString();
+    }
+
+    // Search of single imports.
+    var regex = /@import[ ]*['"](.*)['"][ ]*;/g;
+
+    if (regex.test(content)) {
+        return content.replace(regex, function(m, capture) {
+            if (capture == "bmma") {
+                return m;
+            }
+
+            return getReplace(capture, baseDir, paths, parsedFiles);
+        });
+    }
+
+    // Search of multiple imports.
+    regex = /@import(?:[ \n]+['"](.*)['"][,]?[ \n]*)+;/gm;
+    if (regex.test(content)) {
+        return content.replace(regex, function(m, capture) {
+            var text = "";
+
+            // Divide the import into multiple files.
+            regex = /['"]([^'"]*)['"]/g;
+            var captures = m.match(regex);
+            for (var x in captures) {
+                text += getReplace(captures[x].replace(/['"]+/g, ''), baseDir, paths, parsedFiles) + "\n";
+            }
+
+            return text;
+        });
+    }
+
+    return content;
+}
+
+gulp.task('combine-scss', function(done) {
+    var paths = [
+        'node_modules/ionic-angular/themes/',
+        'node_modules/font-awesome/scss/',
+        'node_modules/ionicons/dist/scss/'
+    ];
+
+    var parsedFiles = [];
+
+    gulp.src([
+            './src/theme/variables.scss',
+            './node_modules/ionic-angular/themes/ionic.globals.*.scss',
+            './node_modules/ionic-angular/themes/ionic.components.scss',
+            './src/**/*.scss'])  // define a source files
+        .pipe(through(function(file, encoding, callback) {
+            if (file.isNull()) {
+                return;
+            }
+
+            parsedFiles.push(file);
+            file.contents = bufferFrom(scssCombine(file.contents, path.dirname(file.path), paths, parsedFiles));
+
+            this.emit('data', file);
+        }))   // combine them based on @import and save it to stream
+        .pipe(concat('combined.scss')) // concat the stream output in single file
+        .pipe(gulp.dest('.'))  // save file to destination.
+        .on('end', done);
+});

package-lock.json

@@ -2520,6 +2520,15 @@
         "typedarray": "^0.0.6"
       }
     },
+    "concat-with-sourcemaps": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/concat-with-sourcemaps/-/concat-with-sourcemaps-1.1.0.tgz",
+      "integrity": "sha512-4gEjHJFT9e+2W/77h/DS5SGUgwDaOwprX8L/gl5+3ixnzkVJJsZWDSelmN3Oilw3LNDZjZV0yqH1hLG3k6nghg==",
+      "dev": true,
+      "requires": {
+        "source-map": "^0.6.1"
+      }
+    },
     "console-browserify": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/console-browserify/-/console-browserify-1.1.0.tgz",
@@ -5867,6 +5876,17 @@
         "through2": "~2.0.1"
       }
     },
+    "gulp-concat": {
+      "version": "2.6.1",
+      "resolved": "https://registry.npmjs.org/gulp-concat/-/gulp-concat-2.6.1.tgz",
+      "integrity": "sha1-Yz0WyV2IUEYorQJmVmPO5aR5M1M=",
+      "dev": true,
+      "requires": {
+        "concat-with-sourcemaps": "^1.0.0",
+        "through2": "^2.0.0",
+        "vinyl": "^2.0.0"
+      }
+    },
     "gulp-flatten": {
       "version": "0.4.0",
       "resolved": "https://registry.npmjs.org/gulp-flatten/-/gulp-flatten-0.4.0.tgz",

package.json

@@ -125,6 +125,7 @@
     "electron-rebuild": "^1.8.1",
     "gulp": "^4.0.0",
     "gulp-clip-empty-files": "^0.1.2",
+    "gulp-concat": "^2.6.1",
     "gulp-flatten": "^0.4.0",
     "gulp-rename": "^1.3.0",
     "gulp-slash": "^1.1.3",