Привет. Есть алгоритм, который берёт все картинки(и сжимает их), все стили(минифицирует и объединяет в один) и скрипты - объединяет в один. Для полного счастья мне не хватает одного функционала. У меня есть папка /src/
, в которой лежит app.js
, а рядом с ним ещё папка /js-modules/
. Что мне нужно, так это сперва обработать app.js при помощи Babel(чтобы код транспилировался с ES5), а затем объединить его с файлами в папке /js-modules/
. Как обработать файл при помощи Babel я знаю, но вот как его же потом прикрепить к файлам из папки - не могу разобраться.
gilpfile.js:
'use strict';
const del = require('del');
const gulp = require('gulp');
const babel = require('gulp-babel');
const concat = require('gulp-concat');
const rename = require('gulp-rename');
const uglify = requrire('gulp-uglify');
const imagemin = require('gulp-imagemin');
const minifyCSS = require('gulp-minify-css');
const sourcemaps = require('gulp-sourcemaps');
const autoprefixer = require('gulp-autoprefixer');
gulp.task("babelify", function () {
return gulp.src("src/app.js")
.pipe(babel())
.pipe(gulp.dest("../assets/js/"));
});
const paths = {
scripts: 'src/js-modules/*.js',
images: 'src/img/*',
styles: 'src/css/*.css'
}
function clean() {
return del(['build']);
}
function images() {
return gulp.src(paths.images)
.pipe(imagemin({optimizationLevel: 5}))
.pipe(gulp.dest('../assets/img'))
}
function scripts() {
return gulp.src(paths.scripts)
.pipe(sourcemaps.init())
.pipe(uglify())
.pipe(concat('modules.min.js'))
.pipe(sourcemaps.write())
.pipe(gulp.dest('../assets/js'))
}
function styles() {
return gulp.src(paths.styles)
.pipe(minifyCSS())
.pipe(rename('style.css'))
.pipe(autoprefixer('last 2 version', 'safari 5', 'ie 8', 'ie 9'))
.pipe(gulp.dest('../assets/css'))
}
function watch() {
gulp.watch(paths.scripts, scripts);
gulp.watch(paths.images, images);
gulp.watch(paths.styles, styles);
}
gulp.task('build', gulp.series(
clean,
gulp.parallel(scripts, images, styles)
));
gulp.task(clean);
gulp.task(watch);
gulp.task('default', gulp-series('build'));