Turns out it didn’t quite work. It successfully “blessed” the files but then all css is omitted from dist/assets.json when the --production flag is used. Here is my current block of code:
// ### Write to rev manifest
// If there are any revved files then write them to the rev manifest.
// See https://github.com/sindresorhus/gulp-rev
var writeToManifest = function(directory) {
return lazypipe()
.pipe(function () {
return $.if('*.css', bless());
})
.pipe(gulp.dest, path.dist + directory)
.pipe(function() {
return $.if('**/*.{js,css}', browserSync.reload({stream:true}));
})
.pipe($.rev.manifest, revManifest, {
base: path.dist,
merge: true
})
.pipe(gulp.dest, path.dist)();
};
@austin I placed the code that you suggested in the writeToManifest lamdba (slightly different code, I am using an earlier version of Sage) which successfully “blessed” the files. However when running gulp --production the css is not included in dist/assets.json. Any suggestions?
@diggs I’m having the same issue. Needed to run some css processes but the revv tasks are tripping me up. The complexity of the gulpfile makes it challenging to modify without opening another can of worms.
@kjprince, agreed. Looks like it’s time to learn Gulp syntax. I feel like the suggestion that @austin made is working but the return in the pipe() method is nullifying the rest of the writeToManafest lambda. I don’t understand enough about Gulp to fix it. As soon as I find a solution I will post it up here!
These problems eat up so much dev time, but I suffer from serious investor bias and always think “but hey, when its done, its done.” Interested to learn your solution.
// ### Build
// `gulp build` - Run all the build tasks but don't clean up beforehand.
// Generally you should be running `gulp` instead of `gulp build`.
gulp.task('build', function(callback) {
runSequence('styles',
'bless',
'scripts',
['fonts', 'images'],
callback);
});
@diggs Did you guys get the files writing to the assets file? I can get it blessing the files also, but I’ve spent hours trying to get it into the assets file.
I wasted way too many hours on this so just moved on. Still don’t have a working solution but considering giving this a shot: https://github.com/postcss/postcss
Hi, i am new to Sage and Gulp and trying to get this to work… First it didn’t work and i lost a few hours to get this to work. That’s why i’ve written my steps down to get this to work for you. Thnx to all guys above for the code!
As always I think there maybe a little more room for improvement though. I think it maybe better to be able to run the Bless task on the css files without the revisioning on them first, then add the revisioning after, this would allow the Assets\asset_path() to be used to switch between the development version and production when needed, as currently Bless will add -blessed1 to the end of the file name and this will break the Assets\asset_path() when called.
Has anyone revisited this with a sound solution? It seems to be running bless ( I can see from the command line)
[16:09:24] Starting 'styles'...
[16:09:32] Finished 'styles' after 8.77 s
[16:09:32] Starting 'bless'...
[16:09:32] Finished 'bless' after 21 μs
However, it’s not breaking up the main.css file into two smaller files which I know is (unfortunately) over 4096 selectors.
I’ve tried running gulp, gulp build and gulp --production.
Thanks for responding @Twansparant. That’s close to what I originally had in an older Sage project I used.
Upon further investigation, there’s an issue with the most recent bless v4, now included with gulp-bless v3.1.0. https://github.com/BlessCSS/bless/issues/93
Since some function in Sage “injects” @charset, a typeError monkey wrench gets thrown, causing the bless process to fail.
In the interim, I’ve installed an older gulp-bless version.
While all compiles fine on gulp build, all is not well with gulp watch.
When running build, @import url('main-blessed1.css?z=1459617040469'); gets printed inside main.css, but while watching, @import url(…) never gets added back in even though bless is run.
[BS] Watching files...
[14:18:01] Starting 'wiredep'...
[14:18:01] Starting 'bless'...
[14:18:01] Finished 'wiredep' after 164 ms
[14:18:01] Starting 'styles'...
[14:18:01] Finished 'bless' after 126 ms
[BS] 1 file changed (main.css)
[14:18:09] Finished 'styles' after 8.21 s