我正在尝试添加一些任务。我有一个基本的HTML网站,我想监视更改并重新加载更新的更改。我正在尝试使用livereload进行监听和更改。但是,当它重新加载时,我得到一个错误,表明该端口已在使用中,这是有道理的。但是我找不到解决方案。第一次使用Gulp,因此欢迎提出任何使我做得更好的提示
var gulp = require('gulp');
var livereload = require('gulp-livereload');
var rev = require('gulp-rev');
var clean = require('gulp-rimraf');
var runSequence = require('run-sequence').use(gulp);
var connect = require('gulp-connect');
gulp.task('build',function () {
// by default,gulp would pick `assets/css` as the base,// so we need to set it explicitly:
return gulp.src(['assets/css/*.css','assets/css/**/*.css','assets/js/*.js','assets/js/**/*.js','assets/js/**/**/*.js','assets/img/**/*.jpg','assets/img/**/*.png'],{ base: 'assets' })
.pipe(gulp.dest('build/assets')) // copy original assets to build dir
.pipe(rev())
.pipe(gulp.dest('build/assets')) // write rev'd assets to build dir
.pipe(rev.manifest())
.pipe(gulp.dest('build/assets')); // write manifest to build dir
});
gulp.task('copy',function () {
gulp.src('index.html')
.pipe(gulp.dest('build'));
gulp.src('assets/fonts/*.*')
.pipe(gulp.dest('build/assets/fonts'));
gulp.src('assets/fonts/revicons/*.*')
.pipe(gulp.dest('build/assets/fonts/revicons'));
});
gulp.task('clean',[],function() {
return gulp.src("build/*",{ read: false }).pipe(clean());
});
gulp.task('watch',function () {
livereload.listen(35729,function(err) {
if(err) return console.log(err);
})
gulp.watch(['index.html','assets/css/*.css',function (e) {
livereload.changed(e.path,35729)
});
});
gulp.task('connect',function() {
connect.server({
host: '0.0.0.0',root: 'build',port: 8000,livereload: true
});
});
gulp.task('default',function() {
runSequence(
'dist',['connect','watch']
);
});
gulp.task('dist',['clean'],function () {
gulp.start('build');
gulp.start('copy');
});