我在试着让Gulp编译我的sass文件。它会看到main.sass文件中的变化,但是如果我@导入文件,它不会看到它们中的变化,除非我重新启动gulp。
这是我的卷宗
var gulp = require('gulp'),
sass = require('gulp-ruby-sass'),
autoprefixer = require('gulp-autoprefixer'),
browserSync = require('browser-sync').create(),
jade = require('gulp-jade');
gulp.task('browser-sync', function() {
browserSync.init({
server: {
baseDir:'./'
}
});
});
// Compiling SASS to CSS
gulp.task('styles', function () {
return sass('assets/sass/main.sass')
.on('error', sass.logError)
.pipe(autoprefixer({
browsers: ['last 3 versions','> 5%'],
cascade: false
}))
.pipe(gulp.dest('assets/css/'))
.pipe(browserSync.stream());
});
//HTML
gulp.task('templates', function() {
var YOUR_LOCALS = {};
gulp.src('./*.jade')
.pipe(jade({
locals: YOUR_LOCALS,
pretty: true
}))
.pipe(gulp.dest('./'))
});
//Default task
gulp.task('default', ['styles', 'watch', 'browser-sync', 'templates']);
gulp.task('watch', function(){
gulp.watch('*.html').on('change', browserSync.reload);
gulp.watch('*.jade').on('change', browserSync.reload);
gulp.watch('*.css').on('change', browserSync.reload);
gulp.watch('assets/sass/main.sass', ['styles']);
gulp.watch('*.jade', ['templates']);
}) 这就是我项目的结构

发布于 2016-04-01 16:25:42
您只关注对assets/sass/main.sass的更改。您需要监视.sass文件在assets/sass下面的任何更改。
gulp.watch('assets/sass/**/*.sass', ['styles']);而不是:
gulp.watch('assets/sass/main.sass', ['styles']);https://stackoverflow.com/questions/36360798
复制相似问题