有没有办法在Gulp中与.css合并.

Question

到目前为止我没有找到解决方案.这就是我现在想出的:

var gulp = require('gulp');
var concat = require('gulp-concat');
var uncss = require('gulp-uncss');
var minifyCSS = require('gulp-minify-css'); 
var concatCss = require('gulp-concat-css');
var less = require('gulp-less');
var stripCssComments = require('gulp-strip-css-comments');

gulp.task('css', function() {
    return gulp.src('css/*.css')
      .pipe(stripCssComments({all:true}))
      .pipe(concat('plugins.css'))
      .pipe(uncss({html: ['index.html']}))
      .pipe(minifyCSS())
      .pipe(gulp.dest('build/css'));
});
gulp.task('less', function() {
    return gulp.src('css/*.less')
      .pipe(less())
      .pipe(stripCssComments({all:true}))
      .pipe(concat('styles.css'))
      .pipe(uncss({html: ['index.html']}))
      .pipe(minifyCSS())
      .pipe(gulp.dest('build/css'));
});

基本上我正在尝试将.less与.css合并,我只想在构建中使用一个.css.我尝试了不同的语法来实现这种效果,但无济于事,gulp总是给我发一条错误信息.有人有想法吗？

Answer 1

如果您的任务中.css有文件,为什么不重命名？css/css.less

如果您不想这样做,则较少提供导入原始CSS文件的能力(与Sass不同).

@import (css) "file1.css";
@import (css) "files2.css";
...

从您的任务中,我不明白为什么您不能将2合并为单个'less'任务,并更新您的主.less文件以预先导入所有.css文件.