Сервер Gulp Livereload не запускается

Я пытаюсь заставить gulp работать с livereload. Gulp не контролирует сам веб-сервер (фактическое веб-приложение - это php-сайт. Когда я запускаю nmap на сервере, я не вижу, чтобы livereload работал, и расширение Chrome указывает на то же самое.

Вот моя задача с глотком:

gulp = require 'gulp'
{livereload} = require('gulp-load-plugins')()

gulp.task 'watch', ['styles'], ->
    livereload.listen()

    gulp.watch './public/include/less/**/*.less', ['styles']
    gulp.watch('./public/include/css/**/*.css').on('change', livereload.changed)

gulp livereload gulp-livereload
person Matt    schedule 13.01.2015    source источник

Ответы (2)


arrow_upward
1
arrow_downward

Вот простое и проверенное решение для прямой загрузки на основе connect сервера и connect-livereload и gulp-livereload плагины:


var gulp = require('gulp');
var connect = require('connect');
var connectLivereload = require('connect-livereload');
var opn = require('opn');
var gulpLivereload = require('gulp-livereload');

var config = {
    rootDir: __dirname,
    servingPort: 8080,

    // the files you want to watch for changes for live reload
    filesToWatch: ['*.{html,css,js}', '!Gulpfile.js']
}

// The default task - called when you run `gulp` from CLI
gulp.task('default', ['watch', 'serve']);

gulp.task('watch', ['connect'], function () {
  gulpLivereload.listen();
  gulp.watch(config.filesToWatch, function(file) {
    gulp.src(file.path)
      .pipe(gulpLivereload());
  });
});

gulp.task('serve', ['connect'], function () {
  return opn('http://localhost:' + config.servingPort);
});

gulp.task('connect', function(){
  return connect()
    .use(connectLivereload())
    .use(connect.static(config.rootDir))
    .listen(config.servingPort);
});

РЕДАКТИРОВАТЬ.

Я пропустил часть PHP. Я не работал с ним, но это может вам помочь: https://github.com/micahblu/gulp-connect-php

person Dmitri Zaitsev    schedule 19.04.2015
comment
Спасибо, но мне это не помогает. Я не могу обслуживать через gulp, сайт - это сайт php, как указано в вопросе. - person Matt; 20.04.2015

arrow_upward
0
arrow_downward

Почему вы не используете синхронизацию с браузером? довольно просто и менее сложно.

Он автоматически открывает окно браузера с портом по умолчанию 3000.

Вот простой пример использования:

var gulp = require(''gulp),
    browserSync = require('browser-sync').create();


// Static server
gulp.task('browser-sync', function() {
    browserSync.init({
        server: {
            baseDir: "./flex_grid/"
        }
    });
});

Вот простой пример использования с компиляцией sass:

var gulp         = require('gulp'),
    sass         = require('gulp-ruby-sass'),
    watch        = require('gulp-watch'),
    sourcemaps   = require('gulp-sourcemaps'),
    autoprefixer = require('gulp-autoprefixer');
    var browserSync = require('browser-sync').create();

gulp.task('default', ['serve']);


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

    browserSync.init({
        server: "./flex_grid/"
    });

    gulp.watch("src/sass/*.scss", ['sass']);
    gulp.watch("flex_grid/*.html").on('change', browserSync.reload);
});


gulp.task('sass', function() {
    return sass(
       'src/sass/flex_grid.scss', {
        style: 'expanded',
        sourcemap: true
    }).on('error', function (err) {
        console.error('Error! ', err.message);
    })
    .pipe(autoprefixer({
        browsers: [ '> 0%', 'last 2 versions', 'Firefox ESR', 'Opera 12.1' ],
        cascade: false
    }))
    .on('error', function (err) {
        console.error('Error! ', err.message);
    })
    .pipe(sourcemaps.write('.', {
        includeContent: false
    }))
    .on('error', function (err) {
        console.error('Error! ', err.message);
    })
    .pipe(gulp.dest('flex_grid'))
    .pipe(browserSync.stream());
});
person Victorino    schedule 08.01.2016