目的:使用gulp-connect实现, 监听html/css/js等文件如有变化, 界面即时自动刷新。
测试:我通过https://www.npmjs.com/package/gulp-connect官网demo例子代码未能实现,需要自己手动F5刷新。
项目目录:
gulpfile.js代码:
var gulp = require('gulp'),
connect = require('gulp-connect');
gulp.task('connect', function() {
connect.server({
root: 'app',
port: 8000,
livereload: true
});
});
gulp.task('html', function () {
gulp.src('./app/*.html')
.pipe(connect.reload());
});
gulp.task('watch', function () {
gulp.watch(['./app/*.html'], ['html']);
});
gulp.task('default', ['connect', 'watch']);
index.html代码:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
s
</body>
</html>
请问各位大大,那里错了或者那里需要调整吗?