Important: This documentation covers Yarn 1 (Classic).
For Yarn 2+ docs and migration guide, see yarnpkg.com.

Package detail

mady-server

guigrpa121MIT4.1.0TypeScript support: included

Easy-to-use tool to manage and translate ICU MessageFormat messages

i18n, MessageFormat, translation, locales, translator

readme

Mady npm version

Mady v4 is a total rewrite of the venerable translation tool, dropping a lot of ballast, enabling new use cases and providing a huge performance boost. If you need features that have been removed (notably React Intl support), you can find v3's docs here. Otherwise, moving to v4 should be very straightforward -- see more details in the migration guide.

An easy-to-use tool to manage and translate ICU MessageFormat messages.

Mady UI

Although not depicted above, MessageFormat messages are supported. Please refer to this guide for more details on the syntax, but here is an example:

console.log(
  _t('someContext_{NUM, plural, one{1 hamburger} other{# hamburgers}}', {
    NUM: 1,
  })
);
// 1 hamburguesa
console.log(
  _t('someContext_{NUM, plural, one{1 hamburger} other{# hamburgers}}', {
    NUM: 2,
  })
);
// 2 hamburguesas

MessageFormat is not only for translation! Even if you only use English, you may need MessageFormat for gender, pluralisation and even regionalisation (regionalization).

Why?

  • Easy-to-use tool for parsing source files, editing translations, comparing languages side-by-side, filtering missing/dubious/unused translations, and compiling to (optionally minified) JavaScript modules.
  • A translation function to run the compiled language modules.
  • Multi-user support: multiple users can work simultaneously, with changes pushed in real time to all of them.
  • Automatic translations: Mady suggests automatic translations as soon as new messages or languages are added to its database.
  • Ultra-fast parsing: Mady watches your application folders and parses files as they are added, changed or deleted, then pushes all changes to the connected users.
  • MessageFormat messages: while it does not solve all the problems in the huge field of i18n, MessageFormat is a much more powerful tool than the conventional gettext (IMHO).
  • Full UNICODE support: messages and translations can include any UNICODE character. In other words, you can now translate 👍 (en) as 👏 (es-ES) and then 💃 (es-ES-andalusia)!
  • BCP47 support and locale inheritance: fetch missing translations from parent/child languages or dialects, and even sibling languages (other regions) as a last resort.
  • Dubious translations: flag some translations to revisit them later on.
  • Modular architecture, allowing advanced users to embed Mady as a translation tool in broader-scope tools (CMS, anyone?).
  • TypeScript support.

Installation

$ npm install --save mady
$ npm install --save-dev mady-server

Usage

There are two main parts in Mady: the web-based translation app and the translation function. The webapp is only needed during development (for the extraction, translation and management of messages and translations), whereas the translation function can be used in your own application, and hence in production as well.

The translation app

Access the translation app by running npx mady (run npx mady --help for more options, including changing the source paths). Mady will automatically launch in your default browser (default URL: http://localhost:8080). From the web application, you can:

  • Update the message database with new messages extracted from your source files
  • Translate your messages to the different supported languages
  • Mark translations as dubious
  • Apply filters: untranslated or unused messages, dubious translations, etc.
  • [Automatically] export translations to JS files with optional minification, for use by the translation function and other integrations

Messages in your source files might have the form: _t('someContext_Once upon a time...') (single or double quotes are supported), where _t() is the default name for the translation function (see below), someContext is some hint for the translator and Once upon a time... is your untranslated MessageFormat message.

Mady's configuration specifies key aspects such as the translation languages. Here is the default configuration (you'll find it under <project>/locales/config.json):

{
  "srcPaths": ["src"],
  "srcExtensions": [".js", ".jsx", ".ts", ".tsx"],
  "langs": ["en"],
  "originalLang": "en",
  "msgFunctionNames": ["_t"],
  "msgRegexps": [],
  "fMinify": false,
  "fJsOutput": true
}

The translation function

Using the translation function is similarly straightforward:

import _t from 'mady';
import locales from './locales/es';

_t.setLocales(locales);

console.log(_t('someContext_Once upon a time...'));
// Érase una vez...
console.log(_t('someContext_Number of items: {NUM}', { NUM: 5 }));
// Número de ítems: 5
console.log(
  _t('someContext_{NUM, plural, one{1 hamburger} other{# hamburgers} }', {
    NUM: 1,
  })
);
// 1 hamburguesa
console.log(
  _t('someContext_{NUM, plural, one{1 hamburger} other{# hamburgers} }', {
    NUM: 2,
  })
);
// 2 hamburguesas

Alternatively, you can set up locales beforehand and then activate one or the other. In case the requested variant is not available, its closest BCP47 parent is enabled:

import _t from 'mady';
import locales from './locales/es';

_t.addLocales('es', locales);
const lang = _t.setLocales('es-US');
// returns 'es', since we don't have the American Spanish variant

const lang = _t.setLocales('fr');
// does nothing, since we have no French translations

BCP47 and translation fallbacks

Mady "fills in the gaps" when building translation modules ({lang.js}). In other words, when you don't provide a translation for message X for a particular language (e.g. es-ES), it will look for suitable fallback translations in related languages:

  • Parent languages (e.g. es)
  • Sibling languages (e.g. es-MX)
  • Children languages (e.g. es-ES-andalusia)

If you use Mady's translation function and it cannot find a suitable translation, it will just take the message key (e.g. someContext_Untranslated message), remove the context prefix (someContext_) and use it as a last-resort fallback.

The locales folder

You can find the following files in the locales folder (./locales by default):

  • A configuration file: config.json
  • A message file: keys.json
  • A raw translation file per language, e.g. fr.json (this is the one you edit with the web application)
  • A compiled translation module (fr.js), generated automatically.

MessageFormat

Mady uses the messageformat.js library by Alex Sexton, which "supports and extends all parts of the ICU MessageFormat standard (see the user guide), with the exception of the deprecated ChoiceFormat." IMHO, and while it does not solve all the problems in the huge field of i18n, it is a much more powerful tool than the conventional gettext.

Some examples of MessageFormat messages are given above (more here), but this does not even scratch the surface of what is enabled by this standard.

Changelog

Why Mady?

This library is named after my cousin, a brilliant person with an extraordinary talent for languages. I thank her for teaching me English when I was a little child.

License (MIT)

Copyright (c) Guillermo Grau Panea 2016-2020

Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

changelog

4.1.0 (2021-2-21)

  • Server + client:
    • Add delete-unused-messages feature.

4.0.0 (2020-12-14)

  • Server:
    • Remove unused uiBase config option.
    • Bugfix: handle directory access errors while source parsing.
  • Client:
    • Fix translation column header tooltip.

4.0.0-rc.0 (2020-12-13)

Reimplemented the whole thing from scratch, with the following goals in mind:

  • Ballast dropping. Several technologies have been dropped since they are not needed for a small application like this (GraphQL, Relay, WebSockets). Some features have also been dropped since we really do not have the bandwidth to maintain them and were not being used (React Intl). Others were really unnecessary, e.g. the capability to edit the configuration from the UI -- this can be done directly by editing the config file.

  • Performance improvements. The client slowed to a crawl when the number of messages to be translated was above 500-600, due to inefficient React components. Mady v4 uses Giu's DataTable component, which renders only the rows being displayed. The result is a whopping 15x decrease in load time for 650 messages and 2 translation languages.

  • Flexibility. The new decomposition in 4 packages (mady, mady-server, mady-client and mady-client-components) makes it possible to:

    • Configure mady as production dependency, and mady-server as development dependency, cleaning up your dependency tree.
    • Embed Mady's client in another tool (using mady-client-components)
    • Include Mady's API endpoints in another API (using mady-server's Express-compatible serverPlugin).

Migration guide:

  • Runtime library (mady package): fully backwards-compatible. Basic usage remains the same, with the only exception being loading the _t helper from the mady library:
// Before
const _t = require('mady');

// After
const _t = require('mady').default;

// If you already imported mady this way, you need to do nothing:
import _t from 'mady';
  • Translations tool (mady-server package): 99% backwards-compatible. You just need to add mady-server to your devDependencies. The executable is the same (mady), so your npm scripts should run just fine.

3.4.0 (2020-1-17)

  • Server:
    • Add --no-auto-translate-new-keys CLI option and noAutoTranslateNewKeys server-plugin option.

3.3.2 (2019-8-25)

  • Client: add visual indication that several messages belong to the same sequence.

3.3.1 (2019-8-16)

3.3.0 (2019-8-16)

  • Server: allow getExtraMessages to provide a numerical seq for message sorting.
  • Client: sort by context, scope, seq and text.

3.2.0 (2019-1-25)

  • Client:
    • Add filtering by scopes!
    • Add quick find!

3.1.2 (2019-1-25)

  • Client: bugfix: delete translation if text is cleared.

3.1.1 (2019-1-25)

  • Server:
    • Update auto-translate function (fix client query field).

3.1.0 (2019-1-21)

  • Server:
    • Add --no-watch CLI option and noWatch server-plugin option.
    • Make logs less verbose.
    • Improve Markdown autotranslations (do not translate multi-line code blocks -- between triple backticks).

3.0.3 (2018-11-14)

3.0.2 (2018-11-14)

  • Replace uglify-js with Terser (better-maintained).

3.0.1 (2018-11-14)

3.0.0 (2018-11-14)

  • General:
    • Add the possibility to request an auto-translation from the server.
  • Server:
    • Server plugin: accept onChange option, a function that is called whenever locales are compiled.
    • Server plugin: make it compatible with a user that already uses websockets.
  • Client:
    • Set a maximum row height (except when selected).

2.13.0 (2018-10-11)

  • Server plugin: accept otherLocaleDirs (same as the --other-dirs flag described below).

2.12.0 (2018-7-20)

  • Add --other-dirs CLI flag (allows you to include keys and translations from the libs you use in your application, as long as those libs are also using Mady).

2.11.1 (2018-3-15)

  • Fix Firefox layout.

2.11.0 (2018-3-15)

  • Add some theming support via URL querystring (try ?theme=bw).

2.10.3 (2018-2-28)

2.10.2 (2018-2-28)

2.10.1 (2018-2-28)

2.10.0 (2018-2-28)

  • Add experimental interface to integrate the Mady server in another Express.js server (lib/serverPlugin).

2.9.0 (2018-2-21)

  • Add support for a getExtraMessages.js hook (in the locale directory), which allows injecting messages in Mady that do not appear in the source files.
  • Add support for Markdown messages and translations (≠ MessageFormat messages).
  • Add support for scoped messages, which produce separate JS output modules (translations are stored in JSON files as always, along with the unscoped message translations).

2.8.0 (2017-10-23)

  • Remove translations from compiled files if the corresponding key no longer exists or is unused.
  • Replace cmd-A shortcut (filter removal) with cmd-shift-A, which causes fewer UX issues.
  • Add originalLang config option to prevent automatic translations for original language. For the time being, this option can only be modified at the server side.

2.7.2, 2.7.3 (2017-8-22)

  • Bugfix: fetch automatic translations also when a new language is added (disabled accidentally).

2.7.1 (2017-8-22)

  • Bugfix: Fix strange behaviour in Production after 3 different key selections — remove relay-query-lookup-renderer and SSR (for the time being).

2.7.0 (2017-8-22)

  • Generate automatic translations whenever new messages or languages are added to the database. All automatic translations are automatically flagged as dubious.

2.6.0 (2017-8-20)

  • Add watch-based (or delta) parsing: Mady now automatically parses files that are added, changed or removed from your watched folders, and then pushes changes in real time to all connected users. This increases parse times a lot and aims at improving developer workflows.

2.5.1 (2017-8-19)

  • Fix SSR.

2.5.0 (2017-8-19)

  • Multi-user support: changes by one user are automatically pushed to other users.
  • Bugfix: correct handling of keyboard shortcuts in filters (caused by an upstream bug).

2.4.0 (July 25, 2017)

  • Add filters: untranslated or unused messages, fuzzy translations.
  • Performance improvements.

2.3.1 (May 3, 2017)

  • Fix missing buffer dependency.

2.3.0 (May 2, 2017)

  • Add React Native compatibility (#9).

2.2.0 (March 16, 2017)

  • Flag translations as dubious.
  • Allow selection of message keys.
  • Improve usability of Translation help (float instead of inline; hide on hover).

2.1.0 (February 2, 2017)

  • [Internal] Now built with Webpack 2

2.0.0 (October 7, 2016)

  • (Minor) breaking change: Mady no longer looks for a .madyrc file at your project root. This file only contained two parameters (the rest of Mady's configuration being stored in the <locales>/config.json file): a port number (which for Mady's purposes is not so important) and the relative path to the locales folder. The relative path should now be passed in with the CLI --dir argument, instead of via .madyrc.

  • [M] Add React Intl integration:

    • If Mady finds the babel-core and babel-plugin-react-intl modules (included as peerDependencies), it will automatically enable the React Intl integration and extract messages from your FormattedMessage/FormattedHTMLMessage components and defineMessages() calls, as supported by the Babel plugin.
    • Add support for React Intl's description field, used to give more context to the translator than the message prefix (e.g. someContext_A message)
    • Translation compilation now generates ${lang}.reactIntl.json files that you can use to bootstrap React Intl
  • [M] Add custom regexp parsing (#6)
  • [M] Add generic JSON output format, useful for some integrations (#6)

1.6.1 (August 25, 2016)

  • [m] Automatically open Mady's webpage when the server starts
  • [m] Bugfix: prevent click on "copy key" button from getting lost when the user is editing another translation.

1.6.0 (August 18, 2016)

  • [m] Add _t.addLocales(lang, locales) function and _t.setLocales(lang) signature: Mady can now keep track of all locales and use parent BCP47 codes when the requested BCP47 is not available.
  • [m] Add _t.addLocaleCode(lang, localeCode) and _t.getLocaleCode(desiredLang) (returning { lang, result }, where the returned lang isn't necessarily the same as desiredLang). These two are useful for bootstrapping locale code.

1.5.0 (August 16, 2016)

  • [M] Better BCP47 support: complete missing translations with those from descendants and ancestors.
    • If you define your languages as ['en-US', 'es'], you'll get three JS files, not two: en, en-US and es.
    • If you define translations for en, en-US will inherit them, plus the specific en-US translations.
    • Translations for a sub-language (e.g. es-ES) will flow up to the parent language if it doesn't have a translation for that key. What's more, those translations will also flow down to other sub-languages (e.g. es-MX) if the key is missing.

1.4.0 (August 1, 2016)

  • [M] Allow Unicode escape sequences in keys and translations (i.e. emojis, and non-English messages!! -- translations were fine already). You can now translate 👍 (en) as 👏 (es-ES) and then 💃 (es-ES-andalusia)
  • [M] Automatic migration from older DB versions.
  • [M] Add --recompile option to CLI.
  • [m] Bug: Fix a case in which removing an item from a list in the settings dialogue also removes the following ones.
  • [m] Get the parse icon to spin again.

1.3.1 (July 23, 2016)

  • [m] Exclude .babelrc from NPM package
  • [m] Bump dependencies

1.3.0 (June 2, 2016)

  • [M] Allow configuration of the message translation functions (markers for message extraction).
  • [M] Support extraction of multi-line messages (especially useful for complex MessageFormat strings with nested plurals and selections).
  • Update docs.
  • Deps: bump `graphql@0.6.0,react-relay@0.9.0` (+ related).
  • Store sources always with slashes (not with backward-slashes in Windows).
  • Bugfix: Details: correct variable usage (add namespace to selectedKeyId prop, to avoid overlap with Relay variable).
  • Add thank-you note to readme.

1.2.1 (May 26, 2016)

  • Fix SSR in production (bad relative paths).

1.2.0 (May 26, 2016)

  • [M] Add server-side rendering (SSR)
  • Show user notifications upon mutation errors.
  • Use promises for all mutations.
  • Add optimistic responses for delete and create mutations.
  • Bugfix: fix Storyboard config.

1.1.0 (May 22, 2016)

  • [M] Migrate to Giu v0.4.x.
  • [M] Add hint screen.
  • Can now press alt-return to commit translation.
  • Back end: compilation now happens synchronously rather than asynchronously whenever the DB changes, as part of the mutation.

1.0.4 (May 2, 2016)

  • [M] Use Giu for all components.
  • Fix #1: Badly formatted translations crash the server process.

1.0.1, 1.0.2, 1.0.3 (Apr. 20, 2016)

  • Fix production dependencies and config.
  • [m] Remove columns for languages missing from config.

1.0.0 (Apr. 20, 2016)

  • Semver
  • [M] Simpler translation edit operations: click to edit, click outside to save, ESC to revert changes.
  • [M] Textareas instead of text inputs, allowing multiline translation fields. Very, very customised textareas.
  • [M] Basic message and language statistics.
  • [M] Autocompile, whenever something changes -- never again forget the compilation step.
  • [m] Don't highlight missing translations of unused keys.

0.1.6 (Apr. 18, 2016)

  • [M] Use mady on mady itself (i18n'd!).
  • [m] Add spinner while parsing.
  • [m] Lots of UX details.

0.1.5 (Apr. 16, 2016)

  • First public release.