Здравствуйте!
Имею в проекте такую структуру папок.
И такой gulp для главной страницы.
const gulp = require('gulp');
const sass = require('gulp-sass');
const concat = require('gulp-concat');
const sourcemaps = require('gulp-sourcemaps');
const autoprefixer = require('gulp-autoprefixer');
const browserSync = require('browser-sync').create();
gulp.task('sass', function() {
return gulp.src('./src/scss/main/*.scss')
.pipe(sourcemaps.init())
.pipe(sass())
.pipe(concat('main.css'))
.pipe(autoprefixer({
browsers: ['last 2 versions'],
cascade: false
}))
.pipe(sourcemaps.write())
.pipe(gulp.dest('./public/css/main/'))
.pipe(browserSync.stream());
});
gulp.task('serve', function() {
browserSync.init({
server: {
baseDir: './public'
}
});
gulp.watch('./src/scss/**/*.scss', gulp.series('sass'));
gulp.watch('./public/*.html').on('change', browserSync.reload);
gulp.watch('./public/js/*.js').on('change', browserSync.reload);
});
gulp.task('default', gulp.series('sass', 'serve'));
Вопрос в том, что у меня добавятся новые страницы в проект и под каждую необходим свой scss для media и основных стилей и я не понимаю как написать это более грамотно в gulpfile. Т.е. при создании страницы например about должен создаться файл в src->scss->about->about.scss к нему в этой же папке media.scss и они после прогонки в галпе должны соединиться в concat в отдельную папку в css файл в public->css->about->about.css. И свой js файл конечно же под каждую страницу.
Не понимаю как минимально записать в галпе, в лучшем случае одну задачу чтобы галп это всё делал.
Так как только начинаю юзать галп просто сделал бы несколько копий задачи sass под каждую страницу с явным указанием пути до файлов, но это много строк. И возможно есть способ сделать это более кратко и просто.
В gulp новичок - надеюсь на понимание)
Заранее спасибо за помощь!
Простой
