2018-07-26 06:40:19 +02:00
|
|
|
# svelte-i18n
|
2018-07-26 03:40:38 +02:00
|
|
|
|
2018-07-26 06:40:19 +02:00
|
|
|
> Internationalization for svelte
|
2018-07-26 03:40:38 +02:00
|
|
|
|
2018-07-27 04:24:17 +02:00
|
|
|
**Work-in-progress**
|
|
|
|
|
|
|
|
## Usage
|
|
|
|
|
|
|
|
### On the `store`
|
|
|
|
|
|
|
|
```js
|
|
|
|
import i18n from 'svelte-i18n'
|
|
|
|
import { Store } from 'svelte/store'
|
|
|
|
|
2018-08-09 00:47:16 +02:00
|
|
|
/** i18n(svelteStore, { dictionary }) */
|
|
|
|
const store = i18n(new Store(), {
|
|
|
|
dictionary: {
|
2018-07-27 04:24:17 +02:00
|
|
|
'pt-BR': {
|
|
|
|
message: 'Mensagem',
|
|
|
|
messages: {
|
|
|
|
alert: 'Alerta',
|
2018-08-09 00:47:16 +02:00
|
|
|
error: 'Erro',
|
|
|
|
},
|
2018-07-27 04:24:17 +02:00
|
|
|
},
|
|
|
|
'en-US': {
|
|
|
|
message: 'Message',
|
|
|
|
messages: {
|
|
|
|
alert: 'Alert',
|
2018-08-09 00:47:16 +02:00
|
|
|
error: 'Error',
|
|
|
|
},
|
|
|
|
},
|
2018-07-27 04:24:17 +02:00
|
|
|
},
|
2018-08-09 00:47:16 +02:00
|
|
|
})
|
|
|
|
|
|
|
|
/**
|
|
|
|
* Extend the initial dictionary.
|
|
|
|
* Dictionaries are deeply merged.
|
|
|
|
* */
|
|
|
|
store.i18n.extendDictionary({
|
|
|
|
'pt-BR': {
|
|
|
|
messages: {
|
|
|
|
warn: 'Aviso',
|
|
|
|
success: 'Sucesso',
|
2018-07-27 04:24:17 +02:00
|
|
|
},
|
2018-08-09 00:47:16 +02:00
|
|
|
},
|
|
|
|
'en-US': {
|
|
|
|
messages: {
|
|
|
|
warn: 'Warn',
|
|
|
|
success: 'Success',
|
|
|
|
},
|
|
|
|
},
|
|
|
|
})
|
|
|
|
|
|
|
|
/** Set the initial locale */
|
|
|
|
store.i18n.setLocale('en-US')
|
2018-07-27 04:24:17 +02:00
|
|
|
```
|
|
|
|
|
|
|
|
### On `templates`
|
|
|
|
|
|
|
|
```html
|
|
|
|
<div>
|
2018-08-09 00:47:16 +02:00
|
|
|
{$_('message')}: {$_.upper('messages.success'))}
|
2018-07-27 04:24:17 +02:00
|
|
|
</div>
|
|
|
|
```
|
2018-08-07 22:44:05 +02:00
|
|
|
|
|
|
|
Renders:
|
|
|
|
|
|
|
|
```html
|
|
|
|
Message: SUCCESS
|
2018-08-09 00:47:16 +02:00
|
|
|
```
|