gulp livereload tidak berfungsi

Saya mengalami masalah aneh ini setelah menginstal paket gulp berikut. Semuanya ditampilkan dengan baik, tetapi ketika sampai ke bagian liveReload(), halaman tidak dimuat ulang...

Saya memasang ekstensi chrome livereload (apakah perlu?), dan sepertinya tidak ada yang perlu dikonfigurasi di sana...

Ini gulpfile saya:

var gulp = require('gulp'),
    autoPrefixer = require('gulp-autoprefixer'),
    jade = require('gulp-jade'),
    liveReload = require('gulp-livereload'),
    sourceMaps = require('gulp-sourcemaps'),
    ts = require('gulp-typescript'),
    tsLint = require('gulp-tslint'),
    watch = require('gulp-watch'),
    sass = require('gulp-sass');

// Configuration
var config = {
    js: 'public/_assets/frontend/js',
    css: 'public/_assets/frontend/css',
    fonts: 'public/_assets/frontend/fonts',
    images: 'public/_assets/frontend/img',
    markup: 'public/'
};

// Javascript
gulp.task('scripts', function() {
    var tsResult = gulp.src(['src/ts/*.ts', 'src/ts/**/*.ts'])
        .pipe(tsLint())
        .pipe(ts({
            noImplicitAny: true
        }));

        tsResult.js
            .pipe(gulp.dest(config.js))
            .pipe(liveReload());
});

// Sass
gulp.task('sass', function() {
    return gulp.src(['src/sass/*.scss', 'src/sass/**/*.scss'])
        .pipe(watch(['src/sass/*.scss', 'src/sass/**/*.scss']))
        .pipe(sourceMaps.init())
        .pipe(sass.sync().on('error', sass.logError))
        .pipe(autoPrefixer({
            browsers: ['last 3 versions'],
            cascade: false
        }))
        .pipe(sourceMaps.write())
        .pipe(gulp.dest(config.css))
        .pipe(liveReload());
});

// jade
gulp.task('markup', function() {
    return gulp.src(['src/**/*.jade', 'src/**/_*.jade'])
        .pipe(jade({
            pretty: true
        }))
        .pipe(gulp.dest(config.markup))
        .pipe(liveReload());
});

// Images
gulp.task('images', function() {
    return gulp.src(['src/images/**/*.*', 'src/images/*.*'])
        .pipe(gulp.dest(config.images));
});

// Watch
gulp.task('watch', function() {
    liveReload.listen();
    gulp.watch(['src/ts/*.ts', 'src/ts/**/*.ts'], ['scripts']);
    gulp.watch(['src/sass/*.scss', 'src/sass/**/*.scss'], ['sass']);
    gulp.watch(['src/*.jade', 'src/**/*.jade'], ['markup']);
});

// Default Task
gulp.task('default', function() {
    gulp.start('sass', 'scripts', 'markup', 'images', 'watch');
});

Semuanya berfungsi dengan baik, gulp melakukan tugasnya dan merender semua file saya, tetapi halaman tidak dapat dimuat ulang... Saya menggunakan server http sederhana python pada port 8000.

Ada ide?


person Naxon    schedule 01.07.2016    source sumber


Jawaban (1)


Satu-satunya hal yang terlintas dalam pikiran saya adalah: apakah Anda memasukkan skrip klien livereload ke halaman Anda? AFAIK Anda seharusnya memasukkan skrip ini di akhir badan halaman Anda.

<script src="http://localhost:35729/livereload.js"></script>
person Community    schedule 01.07.2016