Gulp źródło z innego zadania

Question

Właśnie teraz tworzę tymczasowy plik w Gulp, który prekompiluje moje szablony. Później zgniotam i łączę je w jeden plik javascript. Ale wolałbym nie mieć plików tymczasowych. Czy istnieje sposób na posiadanie "dynamicznych" źródeł w Gulp? Próbowałem łączyć strumienie, ale bezskutecznie.

Przykładowy kod:

gulp.task('template', function() { 
    gulp.src('./src/tpl/*.hbs') 
    .pipe(ember()) 
    .pipe(concat('tpl.js')) // make sure to only do concat after 
    .pipe(gulp.dest('tmp')); 
}); 

gulp.task('uglify', ['template'], function() { 
    gulp.src(['./tmp/tpl.js', './src/js/app.js']) 
    .pipe(uglify()) 
    .pipe(concat('epg.js')) 
    .pipe(gulp.dest('dist')) 
}); 

Answer 1

Zadania nie mogą być doprowadzone do innych zadań bezpośrednio, ale można użyć event-stream aby łączyć strumienie:

var es = require('event-stream'); 
function template() { 
    return gulp.src('./src/tpl/*.hbs') 
    .pipe(ember()); 
} 

function appjs() { 
    return gulp.src(['./src/js/app.js']); 
} 

gulp.task('uglify', function() { 
    return es.merge(template(), appjs()) 
    .pipe(uglify()) 
    .pipe(concat('epg.js')) 
    .pipe(gulp.dest('dist')); 
}); 

Answer 2

więc teoretycznie powinien być w stanie zrobić to z gulp w wersji 3.8.0 lub wyższej. Here is the changelog with an example of the feature.

Od changelogu:

gulp.src obecnie jest zapisywalny passthrough, to znaczy można go używać do dodać pliki do rurociągu w dowolnym punkcie

Więc zadanie może być tak:

gulp.task('template', function() { 
    return gulp.src('./src/tpl/*.hbs') 
    .pipe(ember()) 
    .pipe(concat('tpl.js')) 
    .pipe(gulp.src('./src/js/app.js', { passthrough: true })) 
    .pipe(uglify()) 
    .pipe(concat('epg.js')) 
    .pipe(gulp.dest('dist')) 
}); 

Niestety, wydaje się, że jakiś bug tam, gdzie ma problemy z obsługą niektórych globów, zobacz problemy wymienione pod numerami here i here. Mam nadzieję, że wkrótce zostaną rozwiązane. To uniemożliwia mi użycie tego w moim projekcie, ale w twoim przypadku dodajesz tylko jeden plik, więc wypróbuj go i może zadziała.

Jeśli to nie zadziała, spróbuj użyć merge-stream https://github.com/gulpjs/gulp/blob/master/docs/recipes/using-multiple-sources-in-one-task.md

edytowane obejmują opcję połączenia Przez aby gulp.src wspomniane przez Bjorn Tipling

Answer 3

Dla ktoś nadal zbliża się do tej kwestii ciebie może całkowicie użyć gulp.src, aby dodać dodatkowe pliki do zadania w połowie strumienia. Po prostu musisz dodać opcję { passthrough: true } jako opcję. Oto przykład roboczych:

gulp.task(tasks.SASS,() => { 
    return gulp.src(paths.css.src) 
    .pipe(sass().on('error', sass.logError)) 
    .pipe(gulp.src([ paths.css.vueStyles ], { passthrough: true })) 
    .pipe(concat('styles.css')) 
    .pipe(gulp.dest(paths.css.dest)) 

Jedyna linia, która liczy na to pytanie brzmi:

.pipe(gulp.src([ paths.css.vueStyles ], { passthrough: true })) 

Dane te są potrzebne do pytania, ale w przypadku nie zamieszanie, biorę pliki CSS zbudowany za pomocą SASS jako część zadania, a następnie łączący je z plikami SASS zbudowanymi przez pakiet webpack (wyodrębniony z plików vue) w osobnym zadaniu. Moje zmienne tasks i paths nie pozwalają mi używać łańcuchów zakodowanych na stałe (przez większość czasu).

Uwaga, użyłem łyk 4.0, ale nie sądzę, że to sprawy, passthrough was added to master in 2015