Ottieni il nome del file corrente in gulp.src ()


138

Nel mio file gulp.js eseguo lo streaming di tutti i file HTML dalla examplescartella nella buildcartella.

Creare l'attività gulp non è difficile:

var gulp = require('gulp');

gulp.task('examples', function() {
    return gulp.src('./examples/*.html')
        .pipe(gulp.dest('./build'));
});

Ma non riesco a capire come recuperare i nomi dei file trovati (ed elaborati) nell'attività, o non riesco a trovare il plugin giusto.


Se hai risolto il tuo problema, dovresti pubblicare la tua risposta di seguito. Si dovrebbe non semplicemente modificare la tua domanda con la soluzione.
Andrew Marshall,

2
@AndrewMarshall ... come il mio commento alla modifica, che hai eliminato, spiega, non voglio affermare di aver trovato la risposta corretta, ma voglio dare i crediti alla risposta che lo merita. Ecco perché non ho pubblicato la piccola modifica come risposta. Se pensi che rimuovere la mia modifica sia migliore per gli utenti (o sia solo conforme alle regole di questo sito), allora sono d'accordo. Per chiunque altro, basta fare clic sulla cronologia delle modifiche per vedere cosa c'era prima.
dkastl,

Risposte:


174

Non sono sicuro di come si desidera utilizzare i nomi dei file, ma uno di questi dovrebbe aiutare:

  • Se vuoi solo vedere i nomi, puoi usare qualcosa di simile gulp-debug, che elenca i dettagli del file in vinile. Inserisci questo ovunque desideri un elenco, in questo modo:

    var gulp = require('gulp'),
        debug = require('gulp-debug');
    
    gulp.task('examples', function() {
        return gulp.src('./examples/*.html')
            .pipe(debug())
            .pipe(gulp.dest('./build'));
    });
  • Un'altra opzione è gulp-filelog, che non ho usato, ma suona simile (potrebbe essere un po 'più pulito).

  • Un'altra opzione è gulp-filesize, che genera sia il file che le sue dimensioni.

  • Se si desidera un maggiore controllo, è possibile utilizzare qualcosa di simile gulp-tap, che consente di fornire la propria funzione e guardare i file nella pipe.


7
Grazie! I plug-in "log" non erano quello che stavo cercando, perché scrive solo nel log della console. Ma gulp-tapconsente di ottenere il percorso per ogni file, quindi posso usarlo per aggiornare il mio elenco in un altro file HTML.
dkastl,

Cosa succede se desidero archiviare tutti i file src in un array? il debug non offre molte opzioni.
Abhinav Singi,

22

Ho trovato questo plugin per fare quello che mi aspettavo: gulp-using

Esempio di utilizzo semplice: cerca tutti i file nel progetto con estensione .jsx

gulp.task('reactify', function(){
        gulp.src(['../**/*.jsx']) 
            .pipe(using({}));
        ....
    });

Produzione:

[gulp] Using gulpfile /app/build/gulpfile.js
[gulp] Starting 'reactify'...
[gulp] Finished 'reactify' after 2.92 ms
[gulp] Using file /app/staging/web/content/view/logon.jsx
[gulp] Using file /app/staging/web/content/view/components/rauth.jsx

gulp-using ha fatto molto quello che cercavo grazie.
sghosh968,

10

Ecco un altro modo semplice.

var es, log, logFile;

es = require('event-stream');

log = require('gulp-util').log;

logFile = function(es) {
  return es.map(function(file, cb) {
    log(file.path);
    return cb();
  });
};

gulp.task("do", function() {
 return gulp.src('./examples/*.html')
   .pipe(logFile(es))
   .pipe(gulp.dest('./build'));
});

5
Sai, la maggior parte delle persone non conosce il coffeescript, quindi sarebbe molto più vantaggioso scrivere la risposta nel modo più semplice per il massimo numero di lettori che ne trarrebbero beneficio :)
vsync,

Per me es.mapgenera un errore:SyntaxError: Unexpected token .
vsync,

1
+1 per questa soluzione (senza plug-in). Ma c'è un bug, invece return cb(); dovrebbe essere cb(null, file);. In caso contrario, i file verranno filtrati e non andranno oltre la catena di tubi. Maggiori informazioni controlla documenti per es.map ()
Dimitry K

5

Puoi usare il modulo gulp-filenames per ottenere l'array dei percorsi. Puoi persino raggrupparli per spazi dei nomi:

var filenames = require("gulp-filenames");

gulp.src("./src/*.coffee")
    .pipe(filenames("coffeescript"))
    .pipe(gulp.dest("./dist"));

gulp.src("./src/*.js")
  .pipe(filenames("javascript"))
  .pipe(gulp.dest("./dist"));

filenames.get("coffeescript") // ["a.coffee","b.coffee"]  
                              // Do Something With it 

3

Per il mio caso gulp-ignore era perfetto. Come opzione puoi passare una funzione lì:

function condition(file) {
 // do whatever with file.path
 // return boolean true if needed to exclude file 
}

E l'attività sarebbe simile a questa:

var gulpIgnore = require('gulp-ignore');

gulp.task('task', function() {
  gulp.src('./**/*.js')
    .pipe(gulpIgnore.exclude(condition))
    .pipe(gulp.dest('./dist/'));
});

0

Se vuoi usare la risposta di @OverZealous ( https://stackoverflow.com/a/21806974/1019307 ) in Typescript, importinvece di require:

import * as debug from 'gulp-debug';

...

    return gulp.src('./examples/*.html')
        .pipe(debug({title: 'example src:'}))
        .pipe(gulp.dest('./build'));

(Ho anche aggiunto a title).


perché importinvece di require?
vsync,

Sì, non lo so. Questo è stato nei miei primi giorni di sviluppo di JS e, riflettendo, avrei dovuto approfondire il motivo per cui ha funzionato per me. Ma lo ha fatto e quindi perché l'ho messo su!
HankCa,
Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.