我正在使用 Grunt 来编译带有指南针的 CSS 并触发浏览器 livereload。这些是我的手表任务:
watch: {
styles: {
options: {
spawn: false,
},
files: [assetsDir + '/**/*.scss', '!**/*.{dev,min}.scss'],
tasks: [
'concat:styles',
'compass:styles',
'imagemin:styles',
'cssmin:styles',
'clean:styles',
],
},
scripts: {
options: {
spawn: false,
},
files: [assetsDir + '/**/*.js', '!**/*.{dev,min}.js'],
tasks: [
'concat:scripts',
'uglify:scripts',
],
},
livereload: {
options: {
livereload: true,
spawn: false,
},
files: [assetsDir + '/**/*.{dev,min}.{css,js}'],
},
},
目前,livereload 任务在样式任务完全完成之前不会触发,但是 imagemin 可能会增加一些明显的延迟,而我真正关心的是 CSS,它在指南针完成后就准备好了。
如何在指南针完成后立即触发 livereload,但允许其他任务继续进行?我尝试了下面的配置,当 CSS 更改时触发 imagemin,但它似乎不起作用。对于这个 imagemin,由于某种原因根本不会触发。不能让多个任务监视同一个文件吗?
watch: {
styles: {
options: {
spawn: false,
},
files: [assetsDir + '/**/*.scss', '!**/*.{dev,min}.scss'],
tasks: [
'concat:styles',
'compass:styles',
'cssmin:styles',
'clean:styles',
],
},
scripts: {
options: {
spawn: false,
},
files: [assetsDir + '/**/*.js', '!**/*.{dev,min}.js'],
tasks: [
'concat:scripts',
'uglify:scripts',
],
},
images: {
options: {
spawn: false,
},
files: [assetsDir + '/**/*.{dev,min}.css'],
tasks: [
'imagemin:styles',
],
},
livereload: {
options: {
livereload: true,
spawn: false,
},
files: [assetsDir + '/**/*.{dev,min}.{css,js}'],
},
},
Thanks.