@xonar
А смысл?

Как сделать сборщик на gulp?

Здравствуйте. Недавно как познакомился с gulp, запускать задачи могу, но постоянно делать это лень. Как сделать сборщик, чтобы одной командой он выполнил все задания которые имеются.
Например, scss в css, сжал изображения которые нужны при запуске 1 раз прогнать. Что-то типо npm run build и он бы всё это сделал. Вот мой код. Буду рад, если покажете пример и на документацию ткнёте официальную, а то глядя документацию не очень понял.

'use strict';
 
var gulp = require('gulp');
var sass = require('gulp-sass');
const autoprefixer = require('gulp-autoprefixer');
let cleanCSS = require('gulp-clean-css');
const imagemin = require('gulp-imagemin');

gulp.task('style', function(){
    return gulp.src('source/scss/index.scss')
    .pipe(sass().on('error', sass.logError))
    .pipe(autoprefixer({browsers: ['last 2 versions'],cascade: false}))
    .pipe(cleanCSS({compatibility: 'ie8'}))
    .pipe(gulp.dest('./build/css'));
})


gulp.task('image', () =>
    gulp.src('source/images/**')
    .pipe(imagemin([
        imagemin.gifsicle({interlaced: true}),
        imagemin.jpegtran({progressive: true}),
        imagemin.optipng({optimizationLevel: 5}),
        imagemin.svgo({
            plugins: [
                {removeViewBox: true},
                {cleanupIDs: false}
            ]
        })
    ]))
    .pipe(gulp.dest('build/img'))
);

gulp.task('watch', function(){
    gulp.watch('/source/scss/*.scss',  gulp.parallel('style'))
})
  • Вопрос задан
  • 137 просмотров
Решения вопроса 1
@StockholmSyndrome
gulp.task('default', gulp.parallel('style', 'image', 'watch'));
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы