Как с помощью Gulp сделать Livereload серверной и клиентской части одновременно?

Question

[Alex]

Сейчас мой проект использует Node и как Web сервис и как сервер. Т.е. отдает и статику и данные.
gulp-nodemon умеет перезагружать сервер на Node. Но клиентскую часть уже не перезагрузить, т.к. необходимо вешать Livereload на тот же порт что и Node сервер.
В принципе я могу из gulp-nodemon поймать событие обновления клиентской части, но как в этот момент перезапустить конкретное окно браузера я не знаю.
Идеи?

Answer 1

[Alexey Sosnovsky]

например так

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']);

Comments

[Alexey Sosnovsky]

запускается просто командой gulp которая ватчером смотрит что и где меняется и при сохранении файлика в баузере обновляет всё

[Alex]

Alexey: А сервер? Я в плане NodeJS который на том же порту должен данные отдавать.

[Alexey Sosnovsky]

не совсем понял? сервер при запросе к скриптам обращается. Обновился скрипт и он по новому уже обрабатывает. разве нет? могу чего то не понимать конечно

[Alex]

Alexey: Сервер 1.
Скрипты обращаются по http к серверу с которого пришли, а там и сидит API

[Рафис Багаутдинов]

Работает в 2018. Спасибо за ответ!