0

我对 gulp 比较陌生。当我尝试用子文件夹及其 sass 文件编译一个目录时，我遇到了一个问题。

文件夹结构：

|_sass
   |__folder1
   |   |_file.sass
   |__folder2
   |   |_file.sass
   |__folder3
       |_file.sass

我尝试编译的简单 gulp 任务

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

上面的这个任务不适用于文件夹，但如果我在下面的 gulp 任务中指定文件，它可以正常工作。

gulp.task('sass', function(){
  return sass('sass/folder1/file1.sass')
    .pipe(gulp.dest('css');
}

我已经检查了存储库（gulp-ruby-sass）的文档和 stackoverflow 中的其他主题，我发现的一种解决方案是将所有 sass 代码导入一个文件并编译它。

我尝试了不同的路径：./sass, sass，甚至还有最后一个带有存储库sass/的语法。gulp.src(path/**/*.sass)gulp-sass

你能帮助我吗？提前致谢

4

1 回答 1

1

编辑：使用gulp-sass，不是gulp-ruby-sass，因为gulp-ruby-sass只支持单个文件，如文档中所述：

gulp-ruby-sass 还不支持 glob，只支持单个文件或目录。就像萨斯一样。

您应该使用有效的 glob 参数创建一个流，gulp.src()而不是sass()直接调用并在 a 中调用它pipe()：

gulp.task('sass', function (){
  return gulp.src([
    'sass/folder1/file.sass',
    'sass/folder2/file.sass',
    'sass/folder3/file.sass'
  ])
    .pipe(sass())
    .pipe(gulp.dest('css'));
});

如果您只想导入的文件被正确命名（以下划线开头），这应该也可以：

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

编辑：修复了一些代码错误 - 所以需要一个 linter (;

于 2015-04-15T13:50:24.293 回答