問題描述

我的 Gulp 任務(wù)有問題.我使用一項(xiàng)任務(wù)來創(chuàng)建多個(gè)帶有 gulp-mustache 的 html 文件，因此最后我有兩個(gè)文件(index_de.html 和 index_en.html).我有一個(gè) .json 文件，其中包含字符串.一切正常.但我總是最終得到兩個(gè)文件都是 de 或 en，而不是每種語言一個(gè)文件.我已經(jīng)嘗試過使用循環(huán)[gulp]創(chuàng)建任務(wù)，但這并沒有沒用.

I have a problem with my Gulp tasks. I use one task to create multiple html files with gulp-mustache, so that I have two files (index_de.html and index_en.html) at the end. I have a .json file, that contains the strings. It all works fine. But I always end up with either both files being de or en, instead of one file per language. I already tried creating tasks using a loop [gulp], but that doesn't work.

澄清:兩個(gè)文件包含相同的內(nèi)容.總是.看起來是隨機(jī)的語言，但它總是一樣的.

to clarify: Both files contain the same content. Always. Seems randomly what language it will be, but it's always the same.

我的 Gulp 任務(wù)如下所示:

My Gulp tasks looks like the following:

gulp.task('mustache', function () {
  console.log('Found '+Object.keys(strings).length+' languages.');
  for (var l in strings) {
    var lang = strings[l];
    (function(lang, l) {
    gulp.src(buildpath+'/index.html')
      .pipe(mustache(lang))
      .pipe(rename('index_'+l+'.html'))
      .pipe(compressor({
        'remove-intertag-spaces': true,
        'compress-js': true,
        'compress-css': true
      }))
      .pipe(gulp.dest(destpath+'/'));
    })(lang, l);
  }
});

推薦答案

我認(rèn)為這里的一個(gè)選項(xiàng)是合并一系列 gulp.src() 流并返回合并后的流.這是您的代碼修改為使用 merge-stream npm 包 (https://www.npmjs.com/package/merge-stream).

I think an option here is to merge a series of gulp.src() streams and return the merged streams. Here is your code modified to use the merge-stream npm package (https://www.npmjs.com/package/merge-stream).

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

gulp.task('mustache', function () {
    console.log('Found ' + Object.keys(strings).length + ' languages.');
    var tasks = [];
    for (var l in strings) {
        var lang = strings[l];
        tasks.push(
            gulp.src(buildpath + '/index.html')
                .pipe(mustache(lang))
                .pipe(rename('index_' + l + '.html'))
                .pipe(compressor({
                    'remove-intertag-spaces': true,
                    'compress-js': true,
                    'compress-css': true
                }))
                .pipe(gulp.dest(destpath + '/'))
        );
    }
    return mergeStream(tasks);
});

這篇關(guān)于使用循環(huán)運(yùn)行 Gulp 任務(wù)的文章就介紹到這了，希望我們推薦的答案對(duì)大家有所幫助，也希望大家多多支持html5模板網(wǎng)！