将所有 sass 文件合并到一个文件中 [英] Combine all sass files into a single file

问题描述

gulp-sass 中是否有任何选项可以组合 sass 文件?

Is there any option available in gulp-sass to combine sass files?

例如:

ma​​in.scss:

$var: red;

control.scss:

@import 'main';
.a{
  color: $var;
}

合并后的输出文件应该是单个 scss 文件，如下所示

The combined output file should be single scss file like below

$var: red;
.a{
  color: $var;
}

推荐答案

你尝试过这样的事情吗?

Did you try something like this?

gulp = require('gulp');
concat = require('gulp-concat');

// the default task
gulp.task('default', function() {
    return gulp.src('./*.scss')
       .pipe(concat('all.scss'))
       .pipe(gulp.dest('./dist/'));
});

这应该会在 ./dist/all.scss 中生成单个组合 scss.

This should produce a single combined scss in ./dist/all.scss.

我不知道 @import 语句是否被正确处理，但是这些问题通常由 ad-hoc 模块处理(例如，gulp-sass)，它产生一个 .css 输出...

I don't know if @import statements are handled correctly, but these issues are usually handled by ad-hoc modules (for example, gulp-sass), which produce a .css output...

这篇关于将所有 sass 文件合并到一个文件中的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！