如何让Gulp LESS只输出主文件,忽略包含文件?

5

我有一个文件夹,里面装满了我的应用程序文件夹中的LESS文件。有两个主要文件和几个包含文件,所有这些文件都以“_”为前缀。我只想将这两个文件及其源映射输出到我的构建文件夹中,但是默认设置会输出所有的less文件:

var gutil = require('gulp-util');
var changed = require('gulp-changed');
var path = require('path');
var less = require('gulp-less-sourcemap');

gulp.task('less', function() {
  gulp.src('./app/less/*.less')
     .pipe(less({
        generateSourceMap: true, // default true
        paths: [path.join(__dirname, 'less', 'includes')]
    }))
    .pipe(gulp.dest('./build/css'));
});

我可以把我的包含文件放在一个子目录中,但如果不必这样做,我宁愿不编辑LESS。

更新

我知道如何在gulp.src中指定一个单个文件,但我有两个LESS文件需要分别制作成两个CSS文件,并且每个文件都有自己的映射。


gulp.src('./app/less/main.less') 不行吗? - Florent
我添加了一个更新:我在那里有 main.lesstheme.less - Steve
1个回答

6

解决方案1:

使用event-stream工具。

gulp.task('less', function(cb) {
  var lessc = less({
    paths: [path.join(__dirname, 'less', 'includes')]
  });
  return es.merge(
    gulp.src('app/less/main.less')
      .pipe(lessc)
      .pipe(gulp.dest('build/css')),
    gulp.src('app/less/theme.less')
      .pipe(lessc)
      .pipe(gulp.dest('build/css'))
  );
});

解决方案2:

创建两个任务。

gulp.task('less', ['less:main', 'less:theme']);
gulp.task('less:main', function() {
  return gulp.src('./app/less/main.less')
    .pipe(less({ paths: [path.join(__dirname, 'less', 'includes')] }))
    .pipe(gulp.dest('./build/css'));
});
gulp.task('less:theme', function() {
  return gulp.src('./app/less/theme.less')
    .pipe(less({ paths: [path.join(__dirname, 'less', 'includes')] }))
    .pipe(gulp.dest('./build/css'));
});

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接