Question

我首先要说我已经找了好几个小时，但找不到任何适合我的解决方案。我正试图离开指南针并切换到我公司网站的Sass，我遇到了Sass无法识别我的目录的问题;我收到“文件未找到或无法读取”错误。

我尝试使用vanilla Sass，gulp-sass和gulp-ruby-sass进行编译，我在所有这些上都得到完全相同的错误。这是我的文件夹结构：

- css
- sass
  - variables
     - _colors.scss
     - _type.scss   (... etc.)
  - abstractions
  - base
  - components
- gulpfile.js

我的styles.scss文件看起来像这样（顶部有很多评论）：

@import "variables/**/*";
@import "abstractions/**/*";
@import "base/**/*";
@import "components/**/*";

我的gulpfile.js看起来像这样：

var    gulp = require('gulp'),
       sass = require('gulp-sass');

gulp.task('sass', function() {
  gulp.src('sass/**/*.scss')
    .pipe(sass().on('error', sass.logError))
    .pipe(gulp.dest('./css/'));
});


gulp.task('default', ['sass'], function() {
  gulp.watch("sass/**/*.scss", ['sass']);
});

我得到的确切错误是：

error sass/lgfcu.styles.scss (Line 23: File to import not found or unreadable: variables/**/*.)

我尝试过使用“includePaths”和gulp-sass，但没有运气。我也尝试过使用路径：./variables/**/*，variables/**/*.scss等等。

如果我包含特定文件的完整路径，它确实有效，但是globbing不起作用。任何帮助将不胜感激！

Answer 1

我使用 gulp-sass 时遇到了同样的问题。如果您想要导入整个目录，则必须添加 gulp-sass-bulk-import 。

您可以将它安装到您的项目中，如下所示：

npm install --save-dev gulp-sass-bulk-import

然后在 gulpfile.js ：

中

var gulp = require('gulp'),
    sass = require('gulp-sass'),
    bulkSass = require('gulp-sass-bulk-import');

gulp.task('sass', [], function() {
    gulp.src( 'sass/**/*.scss' )
        .pipe( bulkSass() )
        .pipe( sass().on('error', sass.logError) )
        .pipe( gulp.dest( './css/' ));
});

确保使用正确的包来处理sass文件：

npm install --save-dev gulp-sass

还有另一个包 gulp-ruby-sass ，它不适用于上面的脚本，虽然它也很方便。

享受。

Sass-gulp错误导入整个目录

1 个答案: