Question

我第一次设置Gulp，以便使用NanoCSS和gulp-css将SCSS编译为CSS。我创建了一个dossass，它可以成功编译SCSS并缩小CSS。但是，当我将其放在监视任务中时，它不起作用。如果我更改任何SCSS文件，则do-sass命令不会运行。谁能告诉我我做错了什么？

const gulp = require('gulp');
const sass = require('gulp-sass');
const cssnano = require('gulp-cssnano');


gulp.task('sass', function(){
  return gulp.src('scss/styles.scss')
    .pipe(sass())
    .pipe(gulp.dest('./'))
});

// Minifys .css and reload browser.
gulp.task('mini-css', function() {
    return gulp.src('styles.css')
    .pipe(cssnano())
    .pipe(gulp.dest('./'));
});

// Compile and minify css.
gulp.task('do-sass', gulp.series('sass', 'mini-css'));


gulp.task('watch', function(){
  gulp.watch('scss/*/.scss', gulp.series('do-sass')); 
});

Answer 1

您的监视任务使用的全局模式可能是错误的：scss/*/.scss将不会查找您想要的SCSS文件，因为它将尝试遍历更深的目录并查找名为{{1 }}（没有任何文件名，只有扩展名）。

如果要遍历嵌套在任何级别的任何 SCSS文件，则要使用double-star语法：

.scss

因此，如果您这样更新监视任务，它应该可以工作：

scss/**/*.scss

Gulp Watch在SASS SCSS文件夹中未检测到更改

1 个答案: