吞咽cwd到投影根

Question

我现在的代码是：

gulp.task('_sass', function() {
    var files = [
        './vendor/bower_components/bootstrap-sass/assets/stylesheets/_bootstrap.scss',
        './resources/assets/sass/main.scss',
        './vendor/bower_components/bootstrap-rating/bootstrap-rating.css',
        './vendor/bower_components/select2/select2.css'
    ];
    return gulp.src(files)
    //return gulp.src(files)
        .pipe(concat('all.css'))
        .pipe(sass())
        .on('error', notify.onError(function (error) {
            return "Error: " + error.message;
        }))
        .pipe(gulp.dest('./public/css/'))
        .pipe(reload({stream: true}));
});

正如您所看到的，我有一个文件数组，在该数组中，我将我想要连接到.scss文件的所有路径存储到all.css中。但我知道这个错误：

Error: file to import not found or unreadable: base/normalize
Current dir: /Users/**/Code/Laravel/vendor/bower_components/bootstrap-sass/assets/stylesheets/

这是显而易见的，因为gulp使用数组的第一个路径作为它的基本目录。因此，我尝试将base或cwd设置为'./'，以便指定Laravel根目录。但这不管用。如何解决这个问题，这样我就可以使用所有这些.scss文件而不必将文件复制到其他目录中。

Answer 1

这是一个棘手的问题，因为您不需要相对于gulpfile的基本工作目录，而是相对于所有Sass组件。

我说得对吗，'./resources/assets/sass/main.scss'是您自己使用的主要Sass文件？如果是这样的话，我建议在那里导入引导程序：

 @import '../../../vendor/bower_components/bootstrap-sass/assets/stylesheets/_bootstrap';

在let Sass处理文件时，Sass通常在处理相关URL方面要好得多。

而不是分割Sass和CSS文件，稍后使用流队列将它们捆绑起来：

var queue = require('streamqueue');

gulp.task('_sass', function() {
    return queue(
        // our CSS files
        gulp.src([
            './vendor/bower_components/bootstrap-rating/bootstrap-rating.css',
            './vendor/bower_components/select2/select2.css']
        ),
        // our Sass file, compiled to CSS
        gulp.src('./resources/assets/sass/main.scss')
            .pipe(sass())
    )
    // all the rest
    .pipe(concat('all.css'))
    .on('error', notify.onError(function (error) {
        return "Error: " + error.message;
    }))
    .pipe(gulp.dest('./public/css/'))
    .pipe(reload({stream: true}));
});