[英]Combine all scss file to one css file using gulp
I have this gulpfile.js file.我有这个 gulpfile.js 文件。
Here, you can see that every .scss file is converted to the corresponding .css file but I want all .scss files will be converted to only one .css file which will be main.css.在这里,您可以看到每个.scss文件都转换为相应的.css文件,但我希望所有.scss文件都将转换为一个.css文件,即 main.css。 How can I do this?
我怎样才能做到这一点?
var gulp = require('gulp');
var sass = require('gulp-sass');
var browserSync = require('browser-sync').create();
gulp.task('sass', function() {
return gulp.src('app/scss/**/*.scss')
.pipe(sass())
.pipe(gulp.dest('app/css'))
.pipe(browserSync.reload({
stream: true
}))
});
gulp.task('browserSync', function(done) {
browserSync.init({
server: {
baseDir: 'app'
},
});
done();
})
gulp.task('watch', gulp.series('browserSync', 'sass', function() {
gulp.watch('app/scss/**/*.scss', gulp.series('sass'));
gulp.watch("app/*.html", { events: 'all' }, function(cb) {
browserSync.reload();
cb();
});
gulp.watch('app/js/**/*.js', browserSync.reload);
}));
have you tried putting in a concat before the piping in a destination?你有没有试过在目的地的管道之前放入一个 concat ? You'll need to import the concat function found here .
您需要导入在此处找到的 concat 函数。 The following should combine your files.
以下应合并您的文件。
gulp.task('sass', function() {
return gulp.src('app/scss/**/*.scss')
.pipe(sass())
// concat will combine all files declared in your "src"
.pipe(concat('all.scss'))
.pipe(gulp.dest('app/css'))
.pipe(browserSync.reload({
stream: true
}))
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.