代码如下:
var gulp = require('gulp');
var sass = require('gulp-sass');
var prefix = require('gulp-autoprefixer');
var browserSync = require('browser-sync');
gulp.task('sass', function() {
gulp.src('src/css/*.scss')
.pipe(sass())
.pipe(prefix())
.pipe(gulp.dest('dist/'));
});
gulp.task('browserSync', function() {
browserSync({
server: {
baseDir: '.'
}
});
});
gulp.task('watch', ['sass'], function(){
gulp.watch(['*'], ['rebuild']);
});
gulp.task('rebuild', ['sass'], function() {
browserSync.reload();
});
gulp.task('default', ['browserSync', 'sass', 'watch']);
执行gulp的时候能正确编译sass,中途其他文件变动都能监听到并且刷新页面,唯独对sass文件的变动完全没反应,似乎是没有监听到,可是gulp.watch(['*'], ['rebuild']);
里面的*号不就是指任何类型文件吗?
试了好久,找不出错在哪……求助!谢谢
gulp.watch(['./**/*'], ['rebuild']);
gulp.watch(['*'], ['rebuild']);只监控了当前文件夹下面的所有文件,并没有包括子文件夹下的文件
gulp.task('watch', ['browserSync', 'sass'],
在watch任务里面这么写试试
//自动刷新
gulp.task("f5",function(){
browserSync({
files:"**",
server:{
baseDir:"./"
}
})
})
//监听scss变化
gulp.task("sasswh",function(){
gulp.watch('sass/*.scss',['sass']);
})
//默认事件
gulp.task("default",['sasswh','f5']);
我的是这么写的,其实你单独对解析sass写一个task去完成sass解析