feat(build): gulp 5 upgrade

Upgrades to gulp 5 and makes sure the dist files are identical to 4.0.2 which needed some adjustments as gulp 5 changed some internal logic

assets should not be encoded (otherwise every font and image is broken)
ordered globs (for concatenation) needed an additional package and handle each js/css file separately. This might increase the overall compilation time

Author: lubber-de

package.json

@@ -38,20 +38,19 @@
     "browserslist": "^4.21.4",
     "del": "^6.1.1",
     "extend": "^3.0.2",
-    "gulp": "^4.0.0",
+    "gulp": "^5.0.0",
     "gulp-autoprefixer": "^8.0.0",
-    "gulp-chmod": "^2.0.0",
+    "gulp-chmod": "^3.0.0",
     "gulp-clean-css": "^4.3.0",
     "gulp-clone": "^2.0.1",
     "gulp-concat": "^2.6.1",
     "gulp-concat-css": "^3.1.0",
     "gulp-concat-filenames": "^1.2.0",
-    "gulp-copy": "^4.0.0",
     "gulp-dedupe": "^0.0.2",
     "gulp-flatten": "^0.4.0",
     "gulp-git": "^2.9.0",
     "gulp-header": "^2.0.5",
-    "gulp-if": "^2.0.2",
+    "gulp-if": "^3.0.0",
     "gulp-json-editor": "^2.4.3",
     "gulp-less": "^5.0.0",
     "gulp-plumber": "^1.1.0",
@@ -68,6 +67,7 @@
     "merge-stream": "^2.0.0",
     "mkdirp": "^1.0.4",
     "normalize-path": "^3.0.0",
+    "ordered-read-streams": "^2.0.0",
     "replace-ext": "^1.0.0",
     "require-dot-file": "^0.4.0",
     "wrench-sui": "^0.0.3",

tasks/admin/components/create.js

@@ -127,7 +127,7 @@ module.exports = function (callback) {
 
             // copy dist files into output folder adjusting asset paths
             function copyDist() {
-                return gulp.src(release.source + component + '.*')
+                return gulp.src(release.source + component + '.*', { encoding: false })
                     .pipe(plumber())
                     .pipe(flatten())
                     .pipe(replace(release.paths.source, release.paths.output))
@@ -268,7 +268,7 @@ module.exports = function (callback) {
                         filenames += file.contents;
                     }))
                     .on('end', function () {
-                        gulp.src(manifest.assets)
+                        gulp.src(manifest.assets, { encoding: false })
                             .pipe(concatFileNames('empty.txt', concatSettings))
                             .pipe(tap(function (file) {
                                 filenames += file.contents;

tasks/admin/components/update.js

@@ -113,7 +113,7 @@ module.exports = function (callback) {
             console.info('Committing ' + component + ' files', commitArgs);
             gulp.src('./', gitOptions)
                 .pipe(git.add(gitOptions))
-                .pipe(git.commit(commitMessage, commitOptions))
+                .pipe(git.commit(commitMessage, commitOptions), function () {})
                 .on('error', function (error) {
                     // canProceed = false; bug in git commit <https://github.com/stevelacy/gulp-git/issues/49>
                 })

tasks/admin/distributions/create.js

@@ -136,7 +136,7 @@ module.exports = function (callback) {
                         components,
                         releases
                     ;
-                    themes = gulp.src('dist/themes/default/**/*', { base: 'dist/' })
+                    themes = gulp.src('dist/themes/default/**/*', { base: 'dist/', encoding: false })
                         .pipe(gulp.dest(outputDirectory))
                     ;
                     components = gulp.src('dist/components/*', { base: 'dist/' })
@@ -177,7 +177,7 @@ module.exports = function (callback) {
                     siteTheme = gulp.src('src/_site/**/*', { base: 'src/' })
                         .pipe(gulp.dest(outputDirectory))
                     ;
-                    themes = gulp.src('src/themes/**/*', { base: 'src/' })
+                    themes = gulp.src('src/themes/**/*', { base: 'src/', encoding: false })
                         .pipe(gulp.dest(outputDirectory))
                     ;
 

tasks/admin/distributions/update.js

@@ -78,7 +78,7 @@ module.exports = function (callback) {
                 ? 'Updated distribution to version ' + version
                 : 'Updated files from main repo',
 
-            gitOptions      = { cwd: outputDirectory },
+            gitOptions      = { cwd: outputDirectory, encoding: false },
             commitOptions   = { args: commitArgs, cwd: outputDirectory },
             releaseOptions  = { tag_name: version, owner: release.org, repo: repoName },
 
@@ -109,7 +109,7 @@ module.exports = function (callback) {
             console.info('Committing ' + distribution + ' files', commitArgs);
             gulp.src('./', gitOptions)
                 .pipe(git.add(gitOptions))
-                .pipe(git.commit(commitMessage, commitOptions))
+                .pipe(git.commit(commitMessage, commitOptions), function () {})
                 .on('error', function (error) {
                     // canProceed = false; bug in git commit <https://github.com/stevelacy/gulp-git/issues/49>
                 })

tasks/build/assets.js

@@ -20,7 +20,7 @@ const
 ;
 
 function build(src, config) {
-    return gulp.src(src, { base: config.paths.source.themes })
+    return gulp.src(src, { base: config.paths.source.themes, encoding: false })
         .pipe(gulpif(config.hasPermissions, chmod(config.parsedPermissions)))
         .pipe(gulp.dest(config.paths.output.themes))
         .pipe(print(log.created))

tasks/build/css.js

@@ -19,6 +19,7 @@ const
     less         = require('gulp-less'),
     minifyCSS    = require('gulp-clean-css'),
     normalize    = require('normalize-path'),
+    ordered      = require('ordered-read-streams'),
     plumber      = require('gulp-plumber'),
     print        = require('gulp-print').default,
     rename       = require('gulp-rename'),
@@ -101,12 +102,20 @@ function pack(type, compress) {
         concatenatedCSS = compress ? filenames.concatenatedMinifiedCSS : filenames.concatenatedCSS;
     }
 
-    let src = output.uncompressed + '/**/' + globs.components + ignoredGlobs;
-    if (globs.components.indexOf('table') < 0 && globs.components.indexOf('tab') > 0) {
-        src = [src, '!' + output.uncompressed + '/**/table.css'];
-    }
+    let src = globs.components
+        .replace(/[{}]/g, '')
+        .split(',')
+        .map((c) => {
+            let srcSingle = output.uncompressed + '/**/' + c + ignoredGlobs;
+            if (c === 'tab' && globs.components.indexOf('table') < 0) {
+                srcSingle = [srcSingle, '!' + output.uncompressed + '/**/table.css'];
+            }
+
+            return gulp.src(srcSingle);
+        })
+    ;
 
-    return gulp.src(src)
+    return ordered(src)
         .pipe(plumber())
         .pipe(dedupe())
         .pipe(replace(assets.uncompressed, assets.packaged))

tasks/build/javascript.js

@@ -16,6 +16,7 @@ const
     gulpif     = require('gulp-if'),
     header     = require('gulp-header'),
     normalize  = require('normalize-path'),
+    ordered    = require('ordered-read-streams'),
     plumber    = require('gulp-plumber'),
     print      = require('gulp-print').default,
     rename     = require('gulp-rename'),
@@ -72,7 +73,13 @@ function pack(type, compress) {
     const output         = type === 'docs' ? docsConfig.paths.output : config.paths.output;
     const concatenatedJS = compress ? filenames.concatenatedMinifiedJS : filenames.concatenatedJS;
 
-    return gulp.src(output.uncompressed + '/**/' + globs.components + globs.ignored + '.js')
+    let src = globs.components
+        .replace(/[{}]/g, '')
+        .split(',')
+        .map((c) => gulp.src(output.uncompressed + '/**/' + c + globs.ignored + '.js'))
+    ;
+
+    return ordered(src)
         .pipe(plumber())
         .pipe(dedupe())
         .pipe(replace(assets.uncompressed, assets.packaged))

tasks/config/defaults.js

@@ -115,6 +115,8 @@ module.exports = {
     // whether to load admin tasks
     admin: false,
 
+    stripHeaders: false,
+
     header: {},
 
     // globs used for matching file patterns

tasks/docs/build.js

@@ -71,7 +71,7 @@ module.exports = function (callback) {
         // copy src/ to server
         console.info('Copying examples');
 
-        return gulp.src('examples/**/*.*')
+        return gulp.src('examples/**/*.*', { encoding: false })
             .pipe(gulp.dest(output.examples))
             .pipe(print(log.created))
         ;
@@ -85,7 +85,7 @@ module.exports = function (callback) {
         // copy src/ to server
         console.info('Copying LESS source');
 
-        return gulp.src('src/**/*.*')
+        return gulp.src('src/**/*.*', { encoding: false })
             .pipe(gulp.dest(output.less))
             .pipe(print(log.created))
         ;