svelte-i18n/README.md

136 lines
2.2 KiB
Markdown
Raw Normal View History

# svelte-i18n
2018-07-26 03:40:38 +02:00
2018-08-14 20:21:06 +02:00
> Internationalization for Svelte
## Usage
### On the `store`
```js
2019-03-20 14:00:58 +01:00
import { i18n } from 'svelte-i18n'
import { Store } from 'svelte/store'
/** i18n(svelteStore, { dictionary }) */
2018-08-14 20:21:06 +02:00
let store = new Store()
store = i18n(store, {
dictionary: {
'pt-BR': {
message: 'Mensagem',
2018-08-14 20:21:06 +02:00
greeting: 'Olá {name}, como vai?',
greetingIndex: 'Olá {0}, como vai?',
meter: 'metros | metro | metros',
book: 'livro | livros',
messages: {
alert: 'Alerta',
error: 'Erro',
},
},
'en-US': {
message: 'Message',
2018-08-14 20:21:06 +02:00
greeting: 'Hello {name}, how are you?',
greetingIndex: 'Hello {0}, how are you?',
meter: 'meters | meter | meters',
book: 'book | books',
messages: {
alert: 'Alert',
error: 'Error',
},
},
},
})
/**
* Extend the initial dictionary.
* Dictionaries are deeply merged.
* */
store.i18n.extendDictionary({
'pt-BR': {
messages: {
warn: 'Aviso',
success: 'Sucesso',
},
},
'en-US': {
messages: {
warn: 'Warn',
success: 'Success',
},
},
})
/** Set the initial locale */
store.i18n.setLocale('en-US')
```
### On `templates`
2018-08-14 20:21:06 +02:00
#### Basic usage
```html
<div>
{$_('message')}: {$_('messages.success'))}
<!-- Message: SUCCESS-->
</div>
```
2018-12-01 23:27:27 +01:00
#### Current locale
The current locale is available via `this.store.get().locale`.
2018-08-14 20:21:06 +02:00
#### Interpolation
```html
<div>
2018-08-14 20:21:06 +02:00
<!-- Named interpolation -->
{$_('greeting', { name: 'John' }))}
<!-- Hello John, how are you?-->
<!-- List interpolation -->
{$_('greetingIndex', ['John']))}
<!-- Hello John, how are you?-->
</div>
```
2018-08-07 22:44:05 +02:00
2018-08-14 20:21:06 +02:00
#### Pluralization
2018-08-07 22:44:05 +02:00
```html
2018-08-14 20:21:06 +02:00
<div>
0 {$_.plural('meter', 0))}
<!-- 0 meters -->
1 {$_.plural('meter', 1))}
<!-- 1 meter -->
100 {$_.plural('meter', 100))}
<!-- 100 meters -->
0 {$_.plural('book', 0))}
<!-- 0 books -->
2018-08-16 03:18:07 +02:00
1 {$_.plural('book', 1))}
<!-- 1 book -->
2018-08-14 20:21:06 +02:00
10 {$_.plural('book', 10))}
<!-- 10 books -->
</div>
```
2018-08-14 20:21:06 +02:00
#### Utilities
```html
<div>
{$_.upper('message'))}
<!-- MESSAGE -->
{$_.lower('message'))}
<!-- message -->
{$_.capital('message'))}
<!-- Message -->
{$_.title('greeting', { name: 'John' }))}
<!-- Hello John, How Are You?-->
</div>
2018-12-01 23:27:27 +01:00
```