Techniv Techniv - 5 months ago 26
Node.js Question

How can I merge 2 vinyl-fs with gulp to not create a temporary file from a partial pre-compiling task

In a goal to harmonize the style of an SPA application I want to define somme style variable in a JSON file and use it in my Less compilation.

Basically it can work like this:

gulp.src('variables.json')
.pipe(function () {
// process to create a less file from json
})
.pipe(gulp.dest('less/_variable.json.less'))
.on('end', function(){
gulp.src(['less/*.less', '!less/_*.less'])
.pipe(plugins.less())
.pipe(gulp.dest('css'))
});


And in less:

@import "_variables.json.less";
// Other things


Is-it possible to do it without create an intermediary file before doing the less compilation ?
Is-it possible to merge the result of the first task and the Less source into a same vinyl fs to do the Less compilation ?

Best regards.

Answer

Thanks sven-schoenung to you comment. But I don't want start the development of a Less plugin for now... So, I adopted another approach. I developed a gulp plugin which preprocess the less file to match a @json-import directive to inject the generate variables in the vinyl Less file.

It seems work well. So I published it on NPM.

https://www.npmjs.com/package/gulp-less-json-import