easygettext

easygettext

Simple gettext tokens extraction tools for HTML and Jade files. Also converts from PO to JSON.

Motivation

angular-gettext is a very neat tool, that comes with Grunt tooling to extract translation tokens from your Jade/HTML templates and JavaScript code.

Unfortunately, this has two drawbacks:

• It isn't a simple command-line interface, and forces the usage of Grunt;
• It is angular-specific.

This library comes up with two simple CLI tools to extract and compile your HTML tokens.

Why this library?

Our frontend toolchain, systematic doesn't rely on Grunt/Gulp/Broccoli/... and uses a combination of simple Makefiles and CLI tools to do the job.

The toolchain being framework-agnostic, we don't want to depend on Angular to extract our HTML translation tokens. On another note, we use the standard xgettext tool to extract our JavaScript translation tokens.

Nevertheless, the way [angular-gettext] does it (with tokens, directly in HTML) is elegant, is used by many other libraries and will also be the way to do it in Angular2.

Usage & Examples

gettext-extract

Simply invoke the tool on the templates you want to extract a POT dictionary template from. The optional '--ouput' argument enables you to directly output to a file.

gettext-extract --output dictionary.pot foo.html bar.jade

It recognizes the following token flavours (currently; feel free to extend it!)

<div translate>Hello World</div>
<div translate translate-context="According to...">Hello World</div>
<div translate translate-comment="My comment...">Hello World</div>
<div translate translate-plural="Hello worlds">Hello World</div>
<div placeholder="{{ 'Hello World' | translate }}"></div>
<div placeholder="{{ scopeVariable || ('Hello World' | translate) }}"></div>
<get-text>Hello World</get-text>
<i18n>Hello World</i18n>
<translate>Hello World</translate>
<!--  The default delimiters '{{' and '}}' must be changed to empty strings to handle this example -->
<div placeholder="'Hello World' | translate"></div>

You can combine any context, comment and plural together. Also, you can use 'i18n' instead of 'translate' as master token.

You can also provide your own master tokens:

gettext-extract --attribute v-translate --output dictionary.pot foo.html bar.jade

gettext-extract --attribute v-translate --attribute v-i18n --output dictionary.pot foo.html bar.jade

gettext-extract --startDelimiter '[#' --endDelimiter '#]' --output dictionary.pot foo.html bar.jade

gettext-compile

Outputs or writes to an output file, the sanitized JSON version of a PO file.

gettext-compile --output translations.json fr.po en.po de.po

Testing

Run the tests using mocha:

npm test

We also have extensive coverage:

npm run cover

Testing the CLI

Run:

npm run prepublish

Then run extract-cli.js:

./dist/extract-cli.js --attribute v-translate --attribute v-i18n ~/output.html

Credits

Thanks a million to @rubenv for the initial ideas and implementations in angular-gettext-tools, which inspired me a lot.

Thanks to ES6 and Babel for being awesome.

Licensing

MIT