Javascript 我可以使用具有多个来源和多个目的地的吞咽任务吗？

我的gulpfile.js中包含以下内容：

   var sass_paths = [
        './httpdocs-site1/media/sass/**/*.scss',
        './httpdocs-site2/media/sass/**/*.scss',
        './httpdocs-site3/media/sass/**/*.scss'
    ];

gulp.task('sass', function() {
    return gulp.src(sass_paths)
        .pipe(sass({errLogToConsole: true}))
        .pipe(autoprefixer('last 4 version'))
        .pipe(minifyCSS({keepBreaks:true}))
        .pipe(rename({ suffix: '.min'}))
        .pipe(gulp.dest(???));
});

我想将缩小的css文件输出到以下路径：

./httpdocs-site1/media/css
./httpdocs-site2/media/css
./httpdocs-site3/media/css

我是否误解了如何使用来源/目的地？还是我试图在一项任务中完成太多

---

编辑：更新到相应站点目录的输出路径。

如果要使用多个SRC，但可以在同一个SRC中有多个目的地，则需要使用合并流。这里有一个例子

var merge = require('merge-stream');


gulp.task('sass', function() {
   var firstPath = gulp.src(sass_paths[0])
               .pipe(sass({errLogToConsole: true}))
               .pipe(autoprefixer('last 4 version'))
               .pipe(minifyCSS({keepBreaks:true}))
               .pipe(rename({ suffix: '.min'}))
               .pipe(gulp.dest('./httpdocs-site1/media/css'))
               .pipe(gulp.dest('./httpdocs-site2/media/css'));
   var secondPath = gulp.src(sass_paths[1])
               .pipe(sass({errLogToConsole: true}))
               .pipe(autoprefixer('last 4 version'))
               .pipe(minifyCSS({keepBreaks:true}))
               .pipe(rename({ suffix: '.min'}))
               .pipe(gulp.dest('./httpdocs-site1/media/css'))
               .pipe(gulp.dest('./httpdocs-site2/media/css'));
   return merge(firstPath, secondPath);
});

---

我假设您希望在这里使用不同的管道路径，所以这里有site1和site2，但您可以根据需要在任意多个位置执行此操作。此外，如果您希望有一个包含.min文件的dest和一个不包含.min文件的dest，则可以在任何步骤之前指定dest。

如果您希望使用多个src，但在同一个src中可以有多个目的地，则将要使用合并流。这里有一个例子

var merge = require('merge-stream');


gulp.task('sass', function() {
   var firstPath = gulp.src(sass_paths[0])
               .pipe(sass({errLogToConsole: true}))
               .pipe(autoprefixer('last 4 version'))
               .pipe(minifyCSS({keepBreaks:true}))
               .pipe(rename({ suffix: '.min'}))
               .pipe(gulp.dest('./httpdocs-site1/media/css'))
               .pipe(gulp.dest('./httpdocs-site2/media/css'));
   var secondPath = gulp.src(sass_paths[1])
               .pipe(sass({errLogToConsole: true}))
               .pipe(autoprefixer('last 4 version'))
               .pipe(minifyCSS({keepBreaks:true}))
               .pipe(rename({ suffix: '.min'}))
               .pipe(gulp.dest('./httpdocs-site1/media/css'))
               .pipe(gulp.dest('./httpdocs-site2/media/css'));
   return merge(firstPath, secondPath);
});

我假设您希望在这里使用不同的管道路径，所以这里有site1和site2，但您可以根据需要在任意多个位置执行此操作。此外，您还可以在任何步骤之前指定一个dest，例如，如果您希望有一个dest包含.min文件，另一个没有。您可以使用它来修改文件的写入位置

gulp.task('sass', function() {
    return gulp.src(sass_paths, { base: '.' })
        .pipe(sass({errLogToConsole: true}))
        .pipe(autoprefixer('last 4 version'))
        .pipe(minifyCSS({keepBreaks:true}))
        .pipe(rename(function(path) {
            path.dirname = path.dirname.replace('/sass', '/css');
            path.extname = '.min.css';
        }))
        .pipe(gulp.dest('.'));
});

重要提示：使用

gulp.src

中的

base

选项，您可以使用该选项修改文件的写入位置

gulp.task('sass', function() {
    return gulp.src(sass_paths, { base: '.' })
        .pipe(sass({errLogToConsole: true}))
        .pipe(autoprefixer('last 4 version'))
        .pipe(minifyCSS({keepBreaks:true}))
        .pipe(rename(function(path) {
            path.dirname = path.dirname.replace('/sass', '/css');
            path.extname = '.min.css';
        }))
        .pipe(gulp.dest('.'));
});

重要提示：使用

gulp.src

中的

base

选项，我想这个配方可能会有所帮助

更新

遵循配方中的想法，并过度简化您的样本以给出想法，这可能是一个解决方案：

var gulp=require（'gulp'），
path=require（'path'），
merge=require（'merge-stream'）；
var folders=['httpdocs-site1'，'httpdocs-site2'，'httpdocs-site3']；
gulp.task（'default'，function（）{
var tasks=folders.map（函数（元素）{
返回gulp.src（element+'/media/sass/***.scss'，{base:element+'/media/sass'}）
//…其他步骤。。。
.pipe（gulp.dest（元素+'/media/css'）；
});
返回合并（任务）；
});

我想这个食谱可能会有所帮助

更新

遵循配方中的想法，并过度简化您的样本以给出想法，这可能是一个解决方案：

var gulp=require（'gulp'），
path=require（'path'），
merge=require（'merge-stream'）；
var folders=['httpdocs-site1'，'httpdocs-site2'，'httpdocs-site3']；
gulp.task（'default'，function（）{
var tasks=folders.map（函数（元素）{
返回gulp.src（element+'/media/sass/***.scss'，{base:element+'/media/sass'}）
//…其他步骤。。。
.pipe（gulp.dest（元素+'/media/css'）；
});
返回合并（任务）；
});

对于那些自问如何处理公共/特定css文件（对脚本也适用）的人，这里有一个可能的输出来解决这个问题：

var gulp = require('gulp');
var concat = require('gulp-concat');
var css = require('gulp-clean-css');

var sheets = [
    { src : 'public/css/home/*', name : 'home.min', dest : 'public/css/compressed' },
    { src : 'public/css/about/*', name : 'about.min', dest : 'public/css/compressed' }
];

var common = {
    'materialize' : 'public/assets/materialize/css/materialize.css'
};

gulp.task('css', function() {
    sheets.map(function(file) {
        return gulp.src([
            common.materialize, 
            file.src + '.css', 
            file.src + '.scss', 
            file.src + '.less'
        ])
        .pipe( concat(file.name + '.css') )
        .pipe( css() )
        .pipe( gulp.dest(file.dest) )
    }); 
});

现在所要做的就是在构建对象符号时添加图纸

如果您有附加的公共脚本，您可以在对象

common

上按名称映射它们，然后在本例中的materialize之后，但在

file.src+'.css'

之前添加它们，因为您可能希望用自定义文件覆盖公共文件

请注意，在

src

属性中，您也可以这样放置路径：

'public/css/***.css'

---

要确定整个子代的范围。

对于那些自问如何处理公共/特定css文件（对脚本的作用相同）的人，这里有一个可能的输出来解决这个问题：

var gulp = require('gulp');
var concat = require('gulp-concat');
var css = require('gulp-clean-css');

var sheets = [
    { src : 'public/css/home/*', name : 'home.min', dest : 'public/css/compressed' },
    { src : 'public/css/about/*', name : 'about.min', dest : 'public/css/compressed' }
];

var common = {
    'materialize' : 'public/assets/materialize/css/materialize.css'
};

gulp.task('css', function() {
    sheets.map(function(file) {
        return gulp.src([
            common.materialize, 
            file.src + '.css', 
            file.src + '.scss', 
            file.src + '.less'
        ])
        .pipe( concat(file.name + '.css') )
        .pipe( css() )
        .pipe( gulp.dest(file.dest) )
    }); 
});

现在所要做的就是在构建对象符号时添加图纸

如果您有附加的公共脚本，您可以在对象

common

上按名称映射它们，然后在本例中的materialize之后，但在

file.src+'.css'

之前添加它们，因为您可能希望用自定义文件覆盖公共文件

请注意，在

src

属性中，您也可以这样放置路径：

'public/css/***.css'

---

查看整个后代。

如果对我有很大帮助，请使用

吞咽

第一个论据是什么。第二个参数
条件

如果能在里面找到，就大口吞下

如果
对我有很大帮助，就用
吞咽

第一个论据是什么。第二个参数
条件

如果能在里面找到，就大口吞下

我成功了，不需要任何额外的东西，这是一个非常类似于

const p={
仪表板：{
css:{
原文：['public/dashboard/scss/style.scss'，'public/dashboard/style/*.css']，
dest:“public/dashboard/css/”，
},
},
公众：{
css:{
来源：['public/styles/custom.scss'，'public/styles/*.css']，
dest:'public/css/'，
},
js:{
来源：['public/javascript/*.js']，
dest:'public/js/'，
},
},
};
吞咽任务（“默认”，功能（完成）{
Object.keys（p.forEach）（val=>{
//“val”将作为“仪表板”和“公共”进行两轮测试
回灌
.src（p[val].css.orig）
.pipe（sourcemaps.init（））
.pipe（sass（））
.pipe（autoPrefixer（））
.pipe（cssComb（））
.pipe（cmq（{log:true}））
.pipe（concat（'main.css'））
.pipe（cleanCss（））
.pipe（sourcemaps.write（））
.pipe（gulp.dest（p[val].css.dest））
.pipe（重新加载（{stream:true}））；
});
done（）；//我成功了，不需要任何额外的东西，解决方案与

const p={
仪表板：{
css:{
原文：['public/dashboard/scss/style.scss'，'public/dashboard/style/*.css']，
dest:“public/dashboard/css/”，
},
},
公众：{
css:{
来源：['public/styles/custom.scss'，'public/styles/*.css']，
dest:'public/css/'，
},
js:{
或