gulp-locales-bundler

Merges JSON files scattered here and there across your app. It is designed to convert nested file structure into flat with files containing deep objects. So all of the */locales/en.json files will be compiled into the one en.json keeping nested structure.

It can be helpful if you want to have graceful translation files structure with respect to the component approach, but your app works with only one file containing all of the language-related stuff at once. For example, as angular-translate does it when uses staticFilesLoader.

Quick Start

Install

npm install --save-dev gulp-locales-bundler

Use

gulpfile.js example:

const gulp = require('gulp');
const gulpLocalesBundler = require('gulp-locales-bundler');

gulp.task('locales', function() {
  const options = {
    master: 'en.json', // Copy missed translations from `en.json` files, default is ''.
    omit: 'locales',   // Omit `locales` directory from the resulting objects, default is ''.
  };

  return gulp.src('src/app/**/locales/**/*.json'). // Get all JSON files from `locales` dir.
    pipe(gulpLocalesBundler(options)).             // Bundle.
    pipe(gulp.dest('dist/locales'));               // Spit out.
});

Of course, you can use any names for your JSON files.

Real Life Example

Your application structure:

/src/app/
|-- catalog
|   |-- catalogItem
|   |   |-- locales
|   |   |   |-- en.json
|   |   |   `-- ru.json
|   |   `-- catalogItem.component.js
|   |-- locales
|   |   |-- en.json
|   |   `-- ru.json
|   `-- catalog.component.js
`-- user
    |-- locales
    |   |-- de.json 
    |   |-- en.json
    |   `-- ru.json
    `-- user.component.js

After using the above gulpfile.js:

/dist/locales/
|-- de.json
|-- en.json
`-- ru.json

The en.json file will look like this:

{
  "catalog": {
    "catalogItem": {
      // contents of `/src/app/catalog/catalogItem/locales/en.json`
    },
    // contents of `/src/app/catalog/locales/en.json`
  },
  "user": {
    // contents of `/src/app/user/locales/en.json`
  }
}

So you can obtain values using dot notation, catalog.catalogItem.headline for example.