using i18n-abide with nggettext and grunt in combination to create client and server translations

104 views
Skip to first unread message

Andreas Marschke

unread,
Nov 18, 2014, 4:07:27 PM11/18/14
to nod...@googlegroups.com
Hi!

I'm planning on writing a multilingual application or at least a translated application that uses Grunt,
i18n-abide (grunt-i18n-abide) and angular-gettext for the frontend translation.

Translation for the server-side files works excellently and without a hitch once you understood how
i18n-abide works and that it actually does.(purely a documentation issue and needs to be fixed no 
questions asked but thats mozilla for you)

I have this in my Gruntfile.js:

module.exports = function(grunt) {
    var config = grunt.file.readJSON("config/master.json"),
i18nServerPot = "i18n/templates/LC_MESSAGES/messages.pot",
i18nClientPot = "i18n/templates/LC_MESSAGES/angular.pot",
languages = ["en-US", "de"],
i18nClientTemplates = ["public/templates/*/*.html"];


    grunt.initConfig({
abideExtract: {
   js: {
src: "lib/**/*.js",
dest: "i18n/templates/LC_MESSAGES/messages.pot",
options: {
   language: "Javascript"
}
   },
   html: {
src: ["lib/*/views/*.html", "lib/common/layout/**.html"],
dest: "i18n/templates/LC_MESSAGES/messages.pot",
options: {
   language: "Jinja",
   keyword: "gettext"
}
   }
},
abideCreate: {
   server : {
options: {
   template: i18nServerPot,
   languages: languages,
   localeDir: "i18n"
}
   },
   client: {
options: {
   template: i18nClientPot,
   languages: languages,
   localeDir: "i18n"
}
   }
},
abideMerge: {
   server: {
options: {
   template: i18nServerPot,
   languages: languages,
   localeDir: "i18n"
}
   },
   client: {
options: {
   template: i18nClientPot,
   languages: languages,
   localeDir: "i18n"
}
   }
},
abideCompile: {
   json: {
dest: "i18n",
options: {
   type: "json",
   localeDir: "i18n"
}
   },
   mo: {
options: {
   type: "mo",
   localeDir: "i18n"
}
   }
},
nggettext_extract: {
   pot: {
files: {
   "i18n/templates/LC_MESSAGES/angular.pot": i18nClientTemplates
}
   }
},
nggettext_compile: {
   all: {
files: {
   "public/i18n/translation.js": ["i18n/**/LC_MESSAGES/angular.po"]
}
   }
},
eslint: {
   target: [
"Gruntfile.js",
"lib/**/*.js",
"public/js/**/*.js"
   ]
},
karma: {
   options: {
configFile: "./karma.config.js",
preprocessors: {
   "./build/*.js": ["coverage"],
},
basePath: "./",
files: [
   "public/vendor/mocha/mocha.css",
   "public/vendor/mocha/mocha.js",
   "public/vendor/chai/chai.js",
   "tests/library/*.js"
]
   },
   unit: {
singleRun: true,
colors: false,
browsers: ["PhantomJS"]
   },
   dev: {
singleRun: false,
colors: false,
browsers: ["Chrome"]
   }
}

    });

    grunt.loadNpmTasks("grunt-eslint");
    grunt.registerTask("eslint",["eslint"]);
    grunt.loadNpmTasks("grunt-i18n-abide");
    grunt.loadNpmTasks("grunt-angular-gettext");
    grunt.registerTask("i18nbuild", ["abideExtract", "nggettext_extract", "abideCreate"]);
    grunt.registerTask("translate",["abideMerge", "abideCompile",  "nggettext_compile"]);

};

For a full Gruntfile its really  barebones. Running `grunt i18nbuild` builds the POTemplate files (messages.pot and angular.pot)
But i18n-abide appears not to build the po files for compile:client Console output is as follows: 

 $> grunt i18nbuild && grunt translate
Running "abideExtract:js" (abideExtract) task

Running "abideExtract:html" (abideExtract) task

Running "nggettext_extract:pot" (nggettext_extract) task

Running "abideCreate:server" (abideCreate) task
Locale "en_US" already exists, skipping...
Locale "de" already exists, skipping...

Running "abideCreate:client" (abideCreate) task
Locale "en_US" already exists, skipping...
Locale "de" already exists, skipping...

Done, without errors.
Running "abideMerge:server" (abideMerge) task
>> Locales merged successfully.

Running "abideMerge:client" (abideMerge) task
>> Locales merged successfully.

Running "abideCompile:json" (abideCompile) task

Running "abideCompile:mo" (abideCompile) task

Running "nggettext_compile:all" (nggettext_compile) task

Done, without errors.
 $> find i18n/
i18n/
i18n/templates
i18n/templates/LC_MESSAGES
i18n/templates/LC_MESSAGES/messages.pot
i18n/templates/LC_MESSAGES/angular.pot
i18n/de
i18n/de/messages.js
i18n/de/messages.json
i18n/de/LC_MESSAGES
i18n/de/LC_MESSAGES/messages.mo
i18n/de/LC_MESSAGES/messages.po
i18n/en_US
i18n/en_US/messages.js
i18n/en_US/messages.json
i18n/en_US/LC_MESSAGES
i18n/en_US/LC_MESSAGES/messages.mo
i18n/en_US/LC_MESSAGES/messages.po
 $> find public/i18n/
public/i18n/
public/i18n/translation.js
 $>

Which indicates to me theres either a) bug since it only goes by the directory for the language to
exist, which is created by the server subtask and subsequently doesn't create the angular.po file 
for the languages selected. 

If there is any help you guys can give me I'de be very happy.


Thanks in advance!

Cheers,

Andreas Marschke.
Reply all
Reply to author
Forward
0 new messages