Переписать таск под Gulp.js 4 требует некоторых изменений в структуре кода, так как в новой версии Gulp.js были внесены существенные изменения в API и методологию работы с задачами. В этом ответе я расскажу о самых важных изменениях и покажу пример переписанного таска под Gulp.js 4.
Основные изменения в Gulp.js 4:
- Чтение файлов: в Gulp.js 4 для чтения файлов используется новый пакет Vinyl-fs, который работает на основе потоков и позволяет увеличить производительность чтения файлов. Для выполнения чтения файлов мы можем использовать метод
src()
.
- Поддержка асинхронности: в Gulp.js 4 добавлена поддержка асинхронности в тасках. Это означает, что мы можем использовать функцию обратного вызова или возвращать промис для завершения таска. Это полезно, если вам нужно выполнить асинхронные операции, например, загрузку файлов из удаленного источника.
- Параллельное выполнение задач: Gulp.js 4 предоставляет новый метод
parallel()
, который позволяет выполнять задачи параллельно. Это улучшает производительность исполнения задач, так как они выполняются одновременно, если они не зависят друг от друга.
- Последовательное выполнение задач: Gulp.js 4 предоставляет новый метод
series()
, который позволяет выполнять задачи последовательно. Это полезно, когда задачи зависят друг от друга и должны выполняться в определенном порядке.
Пример переписанного таска под Gulp.js 4:
const gulp = require('gulp'); // Подключение нового пакета для чтения файлов const { src, dest } = require('gulp'); const concat = require('gulp-concat'); const uglify = require('gulp-uglify'); // Переписанный таск function scripts() { return src('src/**/*.js') .pipe(concat('bundle.js')) .pipe(uglify()) .pipe(dest('dist/js')) } // Задача для выполнения таска gulp.task('scripts', scripts); // Задача для параллельного выполнения других задач gulp.task('default', gulp.parallel('scripts', 'otherTask'));
В этом примере мы используем новый синтаксис для чтения файлов с помощью метода src()
. Затем мы объединяем все файлы JavaScript с помощью плагина gulp-concat, сжимаем их с помощью плагина gulp-uglify и сохраняем результат в папке 'dist/js'.
Таск scripts
стал функцией, которую мы экспортируем. Теперь мы можем вызывать эту функцию напрямую или использовать ее в других задачах, таких как default
. В данном примере таск scripts
выполняется параллельно с другими задачами.