我想使用GulpJS创建一个sass文件。主要问题是gulp.src()
在连接时有一个特定的顺序。
我的任务不起作用......
gulp.task('createGlobalScss', function(done) {
return gulp.src([
'sass/colors.scss',
'sass/theme.scss',
'sass/settings.scss',
'sass/functions.scss',
'sass/mixins.scss',
'sass/components/**/settings.scss',
'sass/theme.scss',
'sass/components/**/*.scss'
])
.pipe(concat('globalScss.scss'))
.pipe(gulp.dest('./'));
done();
});
问题:结果无序,我不想使用SASS的@import
。
答案 0 :(得分:1)
gulp plugin gulp-order允许您使用与gulp.src相同的语法重新排序文件流。
您的任务可以按照这样的结构......
var order = require('gulp-order');
gulp.task('createGlobalScss', function() {
return gulp.src('sass/**/*.scss')
.pipe(order([
'sass/colors.scss',
'sass/theme.scss',
'sass/settings.scss',
'sass/functions.scss',
'sass/mixins.scss',
'sass/components/**/settings.scss',
'sass/theme.scss',
'sass/components/**/*.scss'
], { base: __dirname }))
.pipe(concat('globalScss.scss'))
.pipe(gulp.dest('./'));
});
您也可以在此处删除done
,因为在这种情况下您不需要显式异步回调。另请注意,我需要指定一个base
option,以便按预期工作。
根据我们下面的讨论,here is a proof of concept证明了这一点与提议的解决方案一起工作......