A
A
Alex2015-06-29 15:03:19
MySQL
Alex, 2015-06-29 15:03:19

How to Livereload server side and client side at the same time using Gulp?

Right now my project uses Node as both a Web service and a server. Those. Gives both statics and data.
gulp-nodemon is able to restart the server on Node. But the client part can no longer be restarted, tk. you need to hang Livereload on the same port as the Node server.
In principle, I can catch the client-side update event from gulp-nodemon, but I don’t know how to restart a specific browser window at this moment.
Ideas?

Answer the question

In order to leave comments, you need to log in

2 answer(s)
A
Alexey Sosnovsky, 2015-07-09
@sosnovskyas

like this

var gulp = require("gulp");
var connect = require("gulp-connect");
var opn = require("opn");
var jade = require('gulp-jade');

//запускаем локальный сервер
gulp.task('connect', function() {
    connect.server({
        root: 'app',
        livereload: true,
        port: 8888
    });
    opn('http://localhost:8888');
});

//работа с HTML
gulp.task('html', function () {
    gulp.src('./app/*.html')
        .pipe(connect.reload());
});

//работа с CSS
gulp.task('css', function () {
    gulp.src('./app/css/*.css')
        .pipe(connect.reload());
});

//работа с JS
gulp.task('js', function () {
    gulp.src('./app/js/*.js')
        .pipe(connect.reload());
});

// работа с шаблонами JADE
gulp.task('jade', function() {
    var YOUR_LOCALS = {};

    gulp.src('./app/jade/index.jade')
        .pipe(jade({
            locals: YOUR_LOCALS,
            // красивый (не ужатый) вывод
            pretty: true
        }))
        .pipe(gulp.dest('./app/'))
});


//WATCHER
gulp.task('watch', function () {
    gulp.watch(['./app/*.html'], ['html']);
    gulp.watch(['./app/css/*.css'], ['css']);
    gulp.watch(['./app/js/*.js'], ['js']);
    gulp.watch(['./app/jade/*.jade'], ['jade']);
});

//DEFAULT
gulp.task('default', ['connect', 'watch']);

R
retyui, 2015-09-29
@retyui

Browsersync and do not use static at startup, but run as a proxy server on top of your
www.browsersync.io/docs/api/#api-init

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question