variables - 生成多个样式表以 gulp

Question

我想运行一个任务 gulp 来减少生成多个样式表。全部相等，仅更改包含不同变量值的导入之一。

| -- src/
     | -- less/
          | -- colors/
               |-- blue.less
               |-- red.less
          | -- main.less
| -- dist/
     | -- css/
          | -- blue.css
          | -- red.css

ma​​in.less 文件如下所示:

@import <color>

/* more code... */

应替换为:red.less、blue.less...

一旦进行相应的导入，就会生成 css 文件:red.css、blue.css...

Answer 1

我使用了循环，但如果它是最佳解决方案，则不会:

gulp.task('less', function() {
    for (var color in data.colors) {
        gulp.src(['src/less/colors/' + data.colors[color] + '.less', 'src/less/reason.less'])
        .pipe(concat('style-' + data.colors[color] + '.less'))
        .pipe(less({
            paths: [path.join(__dirname, 'src', 'less')],
            plugins: [autoprefix, cleancss]
            
        }))
        .pipe(gulp.dest(path_css));
    }
});