В моем файле gulp.js я транслирую все файлы HTML из examples
папки в build
папку.
Создать задачу gulp несложно:
var gulp = require('gulp');
gulp.task('examples', function() {
return gulp.src('./examples/*.html')
.pipe(gulp.dest('./build'));
});
Но я не могу понять, как получить имена файлов, найденные (и обработанные) в задаче, или не могу найти нужный плагин.
Ответы:
Я не уверен, как вы хотите использовать имена файлов, но одно из них должно помочь:
Если вы просто хотите увидеть имена, вы можете использовать что-то вроде
gulp-debug
, в котором перечислены детали винилового файла. Вставьте это в любое место, где хотите получить список, например:var gulp = require('gulp'), debug = require('gulp-debug'); gulp.task('examples', function() { return gulp.src('./examples/*.html') .pipe(debug()) .pipe(gulp.dest('./build')); });
Другой вариант
gulp-filelog
, который я не использовал, но звучит похоже (он может быть немного чище).Другой вариант:
gulp-filesize
выводит как файл, так и его размер.Если вам нужен больший контроль, вы можете использовать что-то вроде
gulp-tap
, что позволяет вам предоставить свою собственную функцию и просматривать файлы в конвейере.источник
gulp-tap
позволяет получить путь для каждого файла, поэтому я могу использовать его для обновления моего списка в другом файле HTML.Я обнаружил, что этот плагин делает то, что я ожидал: gulp-using
Простой пример использования: поиск всех файлов в проекте с расширением .jsx
gulp.task('reactify', function(){ gulp.src(['../**/*.jsx']) .pipe(using({})); .... });
Выход:
[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
источник
Вот еще один простой способ.
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')); });
источник
es.map
выдает ошибку:SyntaxError: Unexpected token .
return cb();
она должна бытьcb(null, file);
. В противном случае файлы будут отфильтрованы и не пойдут дальше по конвейерной цепочке. Дополнительная информация проверьте документы для es.map ()Вы можете использовать модуль gulp-filenames, чтобы получить массив путей. Вы даже можете сгруппировать их по пространствам имен:
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
источник
В моем случае gulp-ignore был идеальным вариантом. Как вариант, вы можете передать туда функцию:
function condition(file) { // do whatever with file.path // return boolean true if needed to exclude file }
И задача будет выглядеть так:
var gulpIgnore = require('gulp-ignore'); gulp.task('task', function() { gulp.src('./**/*.js') .pipe(gulpIgnore.exclude(condition)) .pipe(gulp.dest('./dist/')); });
источник
Если вы хотите использовать ответ @OverZealous ( https://stackoverflow.com/a/21806974/1019307 ) в Typescript, вам необходимо
import
вместоrequire
:import * as debug from 'gulp-debug'; ... return gulp.src('./examples/*.html') .pipe(debug({title: 'example src:'})) .pipe(gulp.dest('./build'));
(Я также добавил
title
).источник
import
вместоrequire
?