Обычный gulpfile.js

15.07.2017

Стандартный gulpfile для работы с less, es6, ftp. Скрипты и стили минифицируем. Файлы js склеиваем в один с помощью плагина 'gulp-include'. Для стилей делаем sourcemap. И удаляем кеш на сервере (актуально для работы с MODX)

//base part
var gulp = require('gulp'),
    rename  = require('gulp-rename'),
    sourcemaps = require('gulp-sourcemaps');

//css part
var less = require('gulp-less'),
    cleanCSS = require('gulp-clean-css'),
    autoprefixer = require('gulp-autoprefixer');

//ftp part
var gutil = require( 'gulp-util'),
    ftp = require( 'vinyl-ftp' );

//js part
var include = require('gulp-include'),
    uglify  = require('gulp-uglify'),
    babel = require('gulp-babel');

var ftpAccess = {
        host:     'site.com',
        user:     'xykkqhih',
        password: '*********',
        parallel: 10,
        log:      gutil.log
    };
var path = '/public_html/site.com/assets/tmpl';
var conn = ftp.create(ftpAccess);
var cacheTpl = '/public_html/site.com/core/cache/resource';

//сообщение об ошибках
function swallowError(error){
    console.log(error.toString());
    this.emit('end');
}

//задача на выполнение всех действий
gulp.task('default', ['gulp_watch']);

//ватчер над файлами
gulp.task('gulp_watch', function () {
    gulp.watch('./dev/less/**/*.less', ['ftp_css']);
    gulp.watch('./dev/js/**/*.js', ['ftp_js']);
    gulp.watch('./elements/**/*.tpl', ['kill_cache']);
});

//процедура сборки css
gulp.task('less', function () {
    return gulp.src('./dev/less/main.less')
        .pipe(sourcemaps.init())
        .pipe(less({
            parth: ['./less']
        }))
        .on('error', swallowError)
        .pipe(autoprefixer({
            browsers: ['last 10 versions', '> 5%'],
            cascade: false
        }))
        .pipe(cleanCSS())
        .pipe(rename('style.css'))
        .pipe(sourcemaps.write('./'))
        .pipe(gulp.dest('./css'));
});

//грузим css на сервак
gulp.task('ftp_css',['less'], function() {

    return gulp.src( 'css/**', { base: '.', buffer: false } )
        .pipe( conn.newer( path ) ) // only upload newer files
        .pipe( conn.dest( path ) );
});

//собираем js
gulp.task('scripts', function() {
    return gulp.src('./dev/js/app.js')
        .pipe(include())
        .pipe(rename('app.min.js'))
        .pipe(babel({
            presets: ['es2015']
        }))
        .on('error', swallowError)
        .pipe(uglify()) //минифицируем js файл
        .pipe(gulp.dest('js'));   //сохраняем минифицированную версию
});

//грузим js на сервак
gulp.task('ftp_js',['scripts'], function() {

    return gulp.src( 'js/**', { base: '.', buffer: false } )
        .pipe( conn.newer( path ) ) // only upload newer files
        .pipe( conn.dest( path ) );
});

//удаляем некую директорию на сервере
gulp.task('kill_cache', function(){
    conn.rmdir(cacheTpl, function(){
        console.log('Кеш удален');
    });
});

Leave a Reply

*

code