1

我首先会说我已经寻找了几个小时，但没有找到任何适合我的解决方案。我试图摆脱 Compass 并为我公司的网站切换到 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等。

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

4

1 回答 1

0

我在使用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不能与上面的脚本一起使用，尽管它也很方便。

享受。

于 2016-10-18T09:27:16.363 回答