2016-05-12 8 views
0

これは私が./destフォルダhome.htmlhome_de.html そしてhome.htmlに2つのファイルを持っていると思います。これは、データdata.jsongulp-dataを使用して異なる言語の出力HTMLを取得する方法は?

{ 
    "Page title": "hello English" 
} 

のためのJSONファイルである可能性があり

var gulp = require('gulp'); 
var posthtml = require('gulp-posthtml'); 
var mjml = require('gulp-mjml'); 
var nunjucksRender = require('gulp-nunjucks-render'); 
var data = require('gulp-data'); 



gulp.task('html', function() { 
    var plugins = [ 
     require('posthtml-lorem')(), 
     ]; 
    // Gets .html and .nunjucks files in pages 
    return gulp.src('./pages/**/*.+(html|nunjucks)') 
    // Adding data to Nunjucks 
    .pipe(data(function() { 
    return require('./data.json') 
    })) 
    // Renders template with nunjucks 
    .pipe(nunjucksRender({ 
     path: ['./helpers/'] 
    })) 
    .pipe(posthtml(plugins)) 
    .pipe(mjml()) 
    // output files in app folder 
    .pipe(gulp.dest('./dest')) 
}); 

私の一気ファイルでは、英語のコンテンツを持っている必要がありますし、 home_de.htmlの内容はドイツ語である必要があります。私は別の言語のための異なるソースHTMLテンプレートファイルを持っていたくない。

データファイル(.json)のコンテンツは、手動で追加されます

答えて

1

ガルプはnode.js.の周りだけの単純なラッパーでありますfsを要求することにより、ファイルシステムにアクセスすることができます。次に、さまざまな言語のデータファイルをループし、それぞれのHTMLファイルをレンダリングできます。これはトリックを行う必要がありますが、これはテストされていませんが、要点を取得する必要があります。

var fs = require('fs'); 
var gulp = require('gulp'); 
var posthtml = require('gulp-posthtml'); 
var mjml = require('gulp-mjml'); 
var nunjucksRender = require('gulp-nunjucks-render'); 
var data = require('gulp-data'); 



gulp.task('html', function() { 
    var plugins = [ 
     require('posthtml-lorem')(), 
    ]; 

    fs.readdir('./languages/',function(err,files){ 
     if(err) throw err; 
      files.forEach(function(file){ 
       var language = file.split('.')[0]; 
       // Gets .html and .nunjucks files in pages 
       return gulp.src('./pages/**/*.+(html|nunjucks)') 
       // Adding data to Nunjucks 
       .pipe(data(function() { 
        return require('./languages/' + language + '.json') 
       })) 
       // Renders template with nunjucks 
       .pipe(nunjucksRender({ 
        path: ['./helpers/'] 
       })) 
       .pipe(posthtml(plugins)) 
       .pipe(mjml()) 
       // output files in app folder 
       .pipe(gulp.dest('./dest/' + language)); 
     }); 
    }); 
}); 
+0

フォルダ/ myfiles/doは何を持つのでしょうか? –

+0

言語jsonファイルを保持するための規約は何ですか? –

+0

ユーザー設定に関する質問。 en.jsonやde.jsonのような言語ショートコードの後ろに名前を付けるだけです。あなたがオブジェクトをどのように構造化するかについては、それがあなたのすべてです。ハッピーコーディング!^_^ – Popcorn245

関連する問題