UNPKG

3.22 kBMarkdownView Raw
1<div class="main-title">
2<img align="right" width="100" height="100" src="https://messageformat.github.io/messageformat/logo/messageformat.svg">
3<a class="badge" href="http://travis-ci.org/messageformat/messageformat"><img src="https://secure.travis-ci.org/messageformat/messageformat.svg" alt="Build Status"></a>
4<h1>messageformat</h1>
5</div>
6
7The experience and subtlety of your program's text can be important. Messageformat is a mechanism for handling both **pluralization** and **gender** in your applications. It can also lead to much better translations, as it's designed to support [all the languages](http://www.unicode.org/cldr/charts/latest/supplemental/language_plural_rules.html) included in the [Unicode CLDR](http://cldr.unicode.org/).
8
9The ICU has an [official guide](http://userguide.icu-project.org/formatparse/messages) for the format. Messageformat supports and extends all parts of the [standard](http://icu-project.org/apiref/icu4j/com/ibm/icu/text/MessageFormat.html), with the exception of the deprecated ChoiceFormat.
10
11There is a good slide-deck on [Plural and Gender in Translated Messages](https://docs.google.com/presentation/d/1ZyN8-0VXmod5hbHveq-M1AeQ61Ga3BmVuahZjbmbBxo/pub?start=false&loop=false&delayms=3000#slide=id.g1bc43a82_2_14) by Markus Scherer and Mark Davis. But, again, remember that many of these problems apply even if you're only outputting english.
12
13## What problems does it solve?
14
15Using messageformat, you can separate your code from your text formatting, while enabling much more humane expressions. In other words, you won't need to see this anymore in your output:
16
17> There are 1 results.<br>
18> There are 2 result(s).<br>
19> Number of results: 3.
20
21On a more fundamental level, messageformat and its associated tools can help you build an effective workflow for UI texts and translations, keeping message sources in human-friendly formats, compiling them into JavaScript during your build phase, and making them easy to use from your application code.
22
23## What does it look like?
24
25With this message:
26
27```js
28const msgSrc = `{GENDER, select,
29 male {He}
30 female {She}
31 other {They}
32} found {RES, plural,
33 =0 {no results}
34 one {1 result}
35 other {# results}
36}.`;
37```
38
39You'll get these results:
40
41```js
42const MessageFormat = require('messageformat');
43const mf = new MessageFormat('en');
44const msg = mf.compile(msgSrc);
45
46msg({ GENDER: 'male', RES: 1 }); // 'He found 1 result.'
47msg({ GENDER: 'female', RES: 1 }); // 'She found 1 result.'
48msg({ GENDER: 'male', RES: 0 }); // 'He found no results.'
49msg({ RES: 2 }); // 'They found 2 results.'
50```
51
52## Getting Started
53
54To install just the core package, use:
55
56```
57npm install messageformat
58```
59
60This includes the MessageFormat compiler and a runtime accessor class that provides a slightly nicer API for working with larger numbers of messages. Our [Format Guide] will help with the ICU MessageFormat Syntax, and the [Build-time Compilation Guide] provides some options for integrating messageformat to be a part of your workflow around UI texts and translations.
61
62[format guide]: https://messageformat.github.io/messageformat/page-guide
63[build-time compilation guide]: https://messageformat.github.io/messageformat/page-build