Блог

Я пытаюсь настроить gulp для компиляции scss и загрузки его на сайт, после чего я хочу просмотреть предварительный просмотр в браузере. Браузер запускается только один раз при запуске основной задачи galp. При редактировании scss файл снова компилируется и загружается на сайт. Но браузер не обновляется с учетом изменений. Помогите, пожалуйста, я понимаю, что вопрос ребяческий, но все же. Мой gulpfile.js — нашел в интернете, пытаюсь настроить под себя:

 var gulp = require( 'gulp' );
var sass = require( 'gulp-sass' );
var comb = require('gulp-csscomb');
var autoprefixer = require('gulp-autoprefixer');
var gutil = require( 'gulp-util' );
var ftp = require( 'vinyl-ftp' );
var notify = require('gulp-notify');
var browserSync = require('browser-sync').create();





//Browser sync
gulp.task('browser-sync', function() {
    browserSync.init({
        
        
        host: 'my-web-space.pro',
        proxy: 'mysite.com',
    
        port:      80, // порт через который будет проксироваться сервер
        open: 'external', // указываем, что наш url внешний 
        notify:    true,
        ghost:     true,
       
    },function(){
        // something you want to do
    }
    );

    
});




// Compile and autoprefix SASS
gulp.task('sass', function () {
    return gulp.src('./sass/**/*.scss')
        .pipe(sass({
            outputStyle: 'expanded'
        }).on('error', sass.logError))
        .pipe(autoprefixer({
            browsers: ['last 2 versions'],
            cascade: false
        }))
        .pipe(gulp.dest('./build'));
        
        
});

// Beautify and format CSS
gulp.task('comb', ['sass'], function() {
    return gulp.src('./build/*.css')
    .pipe(comb())
    .pipe(gulp.dest('./build/'));
});

gulp.task( 'deploy', ['sass', 'comb'], function () {

    var conn = ftp.create( {
        host:     '',
        user:     '',
        password: '',
        parallel: 3,
        log:      gutil.log
    } );

    var globs = [
        './build/*.css'
    ];

    // turn off buffering in gulp.src for best performance
    return gulp.src( globs, {
            base: './build',
            buffer: false
        } )
        .pipe( conn.dest( '/my-web-space.pro/wp-content/themes/astra-child/custom-css/' ) )
        .pipe(notify("Загрузка завершена успешно!"))
        .pipe(browserSync.reload({stream:true}));
        
} );

gulp.task('default',['sass', 'comb', 'deploy', 'browser-sync'], function() {
    gulp.watch('./sass/**/*.scss', ['sass', 'comb', 'deploy', 'browser-sync']);
    
});