tutorial español con compilar gulp

español - Obtenga el nombre del archivo actual en gulp.src()



npm gulp (7)

Aquí hay otra manera simple.

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'')); });

En mi archivo gulp.js estoy transmitiendo todos los archivos HTML desde la carpeta de examples a la carpeta de build .

Para crear la tarea de trago no es difícil:

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

Pero no puedo entender cómo recuperar los nombres de archivo encontrados (y procesados) en la tarea, o no puedo encontrar el complemento correcto.


Encontré este plugin haciendo lo que esperaba: gulp-using

Ejemplo de uso simple: busca todos los archivos en el proyecto con la extensión .jsx

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

Salida:

[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


No estoy seguro de cómo quiere usar los nombres de los archivos, pero uno de estos debería ayudar:

  • Si solo quiere ver los nombres, puede usar algo como gulp-debug , que enumera los detalles del archivo de vinilo. Insertar esto en cualquier lugar que desee una lista, así:

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

  • Otra opción es gulp-filelog , que no he usado, pero suena similar (podría ser un poco más limpio).

  • Otra opción es gulp-filesize , que genera tanto el archivo como su tamaño.

  • Si desea más control, puede usar algo como gulp-tap , que le permite proporcionar su propia función y ver los archivos en la tubería.


Para mi caso, gulp-ignore fue perfecto. Como opción, puede pasar una función allí:

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

Y la tarea se vería así:

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


Puede usar el módulo gulp-filenames para obtener la matriz de rutas. Incluso puedes agruparlos por espacios de nombres:

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


Si desea usar el nombre del archivo para bifurcar dentro de una tubería, gulp-if podría ser una buena opción.

gulp .task(''foo'', () => [...]) .pipe(gulpif(file => { return file.path.indexOf(''myName'') !== -1 ? false : true; }, doSomething(), doSomethingElse())) .pipe(concat(''output.file''));

Mi caso de uso era el de uglifying JavaScript del proveedor, algunos de ellos contenían la sintaxis de ES6 que UglifyJS no puede tratar (y que ya se ha modificado).

Por cierto: Gulp realmente no debería necesitar un complemento para darle acceso a algo tan básico como el nombre del archivo procesado.


Si desea utilizar @OverZealous ''answer ( https://.com/a/21806974/1019307 ) en Typescript, debe import lugar de require :

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

(También agregué un title ).