web-dev-qa-db-fra.com

Comment puis-je écrire une simple fonction de gulp pipe?

Cela fait un jour que j'essaie d'écrire deux fonctions de canal, une qui compile moins de fichiers et une autre qui concatère ces fichiers. Je veux apprendre à écrire des flux/canaux de transformation pour des plugins plus complexes.

Je veux donc savoir comment lire les données d'un autre canal, et comment modifier ces données et les envoyer au canal suivant. Voici ce que j'ai jusqu'à présent:

 gulp.src(sources)
   .pipe(through.obj(function (chunk, enc, cb) {

     var t = this;
     // console.log("chunk", chunk.path);
     fs.readFile(chunk.path, enc, function (err,data) {
       if (err) { cb(err); }

       less.render(data, {
         filename : chunk.path,
         sourceMap : {
           sourceMapRootpath : true
         }
       })
       .then(function (outputCss) {
          // console.log("less result",outputCss);
          t.Push(chunk);// or this.Push(outputCss) same result
          cb();
       });

     });

   }))
   .pipe(through.obj(function (chunk, enc, cb) {
     console.log("chunk", chunk.path); // not event getting called.
     cb();
   }))

Je ne peux pas obtenir le outputCSS pour chaque fichier dans le deuxième canal. Comment puis-je l'envoyer?

javascriptnode.jsgulp
51
Vlad Nicula

Eh bien, vous n'avez pas besoin d'utiliser fs ici, vous avez déjà le flux de fichier (ici votre chunk).

Un autre point, vous ne renvoyez pas au pipe les fichiers, donc je suppose que c'est pourquoi rien n'est appelé sur votre second.

var through = require('through2')

gulp.src(sources)
  .pipe(through.obj(function (chunk, enc, cb) {
    console.log('chunk', chunk.path) // this should log now
    cb(null, chunk)
  }))

Dans ES2015:

import through from 'through2'

gulp.src(sources)
  .pipe(through.obj((chunk, enc, cb) => cb(null, chunk)))

Et pour votre exemple spécifique:

.pipe(through.obj(function (file, enc, cb) {
  less.render(file.contents, { filename: file.path, ... }) // add other options
    .then(function (res) {
      file.contents = new Buffer(res.css)
      cb(null, file)
    })
}))

C'est encore assez basique, je ne vérifie pas les erreurs, si ce n'est pas un flux et ainsi de suite, mais cela devrait vous donner un indice sur ce que vous avez manqué.

59
Balthazar