如何使用Gulp处理sass文件(.sass)？

Question

我有一个重要的问题要问：

我有一堆sass文件(不是scss)，我正在使用gulp，但这里的问题是Gulp只接受scss文件

所以我想知道我的gulp文件是否可能接受sass而不是css，或者两者都接受。

这是我的gulpfile：

function Default () {

browserSync.init({ 
    server: "./src"
});

gulp.watch('src/sass/*.scss', Sass);
gulp.watch("src/*.html").on('change',browserSync.reload);

}

function Sass(){

return gulp.src(['node_modules/bootstrap/scss/bootstrap.scss','src/sass/*.scss'])
.pipe(sass()) //le decimos que vamos a convertir nuestro archivo sass 
.pipe(gulp.dest("src/css")) //le dcemos que lo guarde aquí
.pipe(browserSync.stream());
}

 exports.default = Default;

Answer 1

Gulp通过在gulp.src中作为参数传递的src数组以及在监视函数中传递的要监视的文件来接受文件类型。

因此，在上面的代码中更改为类似这样的内容，以接受sass作为文件类型(而不是scss)，然后告诉监视器函数在sass更改时运行。

这里的sassdirectoryglob是一个glob，它将包含您所在位置的所有.sass类型的文件，这些文件将被监视。

gulp.watch(sassdirectoryglob, Sass);

也适用于main Sass函数，其中arrayofsassfiles应该是只需要编译的主文件(不是以下划线开头的部分文件)。

function Sass(){

return gulp.src(arrayofsassfiles)
.pipe(sass()) //le decimos que vamos a convertir nuestro archivo sass 
.pipe(gulp.dest("src/css")) //le dcemos que lo guarde aquí
.pipe(browserSync.stream());
}