我正在尝试使用MAMP设置gulp来运行livereload。这是我的gulpfile:
'use strict';
var gulp = require('gulp');
var del = require('del');
var sass = require('gulp-sass');
var livereload = require('gulp-livereload');
var paths = {
elements: ['elements/**/*']
};
gulp.task('clear:cache', function () {
return del(['core/cache/**/*']).then(function(){
livereload();
console.log('live reload called');
}).catch(function(){
livereload();
});
});
gulp.task('sass', function () {
console.log('sassy live reload');
return gulp.src('assets/styles/scss/*.scss')
.pipe(sass().on('error', sass.logError))
.pipe(gulp.dest('assets/styles/css'))
.pipe(livereload());
});
gulp.task('sass:watch', function () {
gulp.watch('assets/styles/scss/*.scss', ['sass']);
});
// Rerun the task when a file changes
gulp.task('watch', function() {
livereload.listen({port:8888,host:"localhost",start:true, reloadPage:"index.php"});
gulp.watch(paths.elements, ['clear:cache', 'sass:watch']);
});
// The default task (called when you run `gulp` from cli)
gulp.task('default', ['sass:watch','clear:cache','watch']);
正如您所看到的,gulpfile应该清除缓存并在每当对elements目录中的文件进行更改时重新加载浏览器,并在编译sass并在任何scss文件更改时重新加载浏览器。缓存清除和sass编译工作正常,并且都在各自的函数中吐出console.log消息。
我遇到麻烦的是获取livereload来重新加载浏览器。我知道livereload正在运行,但根本没有针对浏览器,事实上,因为我在我的终端中收到了像/Applications/MAMP/htdocs/assets/styles/css/style.css reloaded
这样的消息。
答案 0 :(得分:0)
默认情况下,LiveReload扩展侦听端口35729.要使用其他端口,例如示例中的8888,则必须覆盖默认端口。您可以在此处找到更多信息http://feedback.livereload.com/knowledgebase/articles/195869-how-to-change-the-port-number-livereload-listens-o