Elixir gulp versioning - allow rev-manifest.js merges instead of ovewrites - laravel

Question

I am attempting a way to run gulp for every page separately.
Every page has its gulp file and you can gulp for a page only with $ gulp --file=name
These gulpfiles are stored under /gulp So my main gulpfile.js has the following:
require('./gulp/elixir-extensions');
var args = require("yargs");
var file = args.argv.file;
if(file){
var path = './gulp/'+file;
require('./gulp/'+file);
}
else{
console.log('Pass the file: gulp --file:name');
}
So in my /gulp directory I have gulpfile extensions for every page on my site. home.js, about.js, contact.js, login.js etc..
Typically - home.js
var elixir = require('laravel-elixir');
elixir(function(mix) {
mix
/**
* Combine home scripts
*/
.scripts(...)
/**
* Combine home CSS files
*/
.styles(...)
/**
* Remove unused css selectors
*/
.uncss(...)
/**
* Remove redundant/repeated css declarations
*/
.purge(...)
/**
* Apply version control
*/
.version([
"public/css/home.css",
"public/js/home.js",
]);
});
and my gulp/elixir-extensions.js :
const gulp = require('gulp');
const Elixir = require('laravel-elixir');
const Task = Elixir.Task;
const uncss = require('gulp-uncss');
const purge = require('gulp-css-purge');
const rename = require('gulp-rename');
Elixir.extend('uncss', function(file, link, out, renamed) {
new Task('uncss', function() {
return gulp.src(file)
.pipe(uncss({
html: [link]
}))
.pipe(rename(renamed))
.pipe(gulp.dest(out));
});
});
Elixir.extend('purge', function(css, out, renamed) {
new Task('purge', function() {
return gulp.src(css)
.pipe(purge())
.pipe(rename(renamed))
.pipe(gulp.dest(out));
});
});
My problem is that the public/build/rev-manifest.js gets ovewritten every time I gulp for a single page.
rev-manifest.js after $ gulp --file=home
{
"css/home.css": "css/home-0a3d3926fc.css",
"js/home.js": "js/home-6df29810e8.js"
}
rev-manifest.js after $ gulp --file=about
{
"css/about.css": "css/about-fc0a5d3926.css",
"js/about.js": "js/about-f0921ds0e8.js"
}
How can I merge every revision like the following?
{
"css/home.css": "css/home-0a3d3926fc.css",
"js/home.js": "js/home-6df29810e8.js",
"css/about.css": "css/about-fc0a5d3926.css",
"js/about.js": "js/about-f0921ds0e8.js"
}

Answer 1

Figured out a solution - do all the versioning in the main gulpfile.js.
This way, every page gets its assets only versioned (but not compiled) every time.
require('./gulp/elixir-extensions');
var elixir = require('laravel-elixir');
var args = require("yargs");
var file = args.argv.file;
if(file){
var filepath = './gulp/'+file;
require('./gulp/'+file);
elixir(function(mix) {
mix
/**
* Apply version control to all assets
*/
.version([
"public/css/auth.css",
"public/css/backend.css",
"public/js/backend.js",
"public/css/home.css",
"public/js/home.js",
"public/css/about.css",
"public/js/about.js",
])
// .phpUnit()
// .compressHtml()
});
}
else{
console.log('Pass the file: gulp --file:name');
}