svelte-i18n/README.md

50 lines
1.3 KiB
Markdown
Raw Normal View History

2019-11-21 05:51:22 +01:00
[![npm version](https://badge.fury.io/js/svelte-i18n.svg)](https://badge.fury.io/js/svelte-i18n) ![](https://github.com/kaisermann/svelte-i18n/workflows/CI/badge.svg)
2019-11-21 02:50:00 +01:00
# svelte-i18n
2018-07-26 03:40:38 +02:00
2019-05-19 04:02:24 +02:00
> Internationalization for Svelte.
2019-11-21 05:51:22 +01:00
`svelte-i18n` helps you localize your app using the reactive tools Svelte provides. By using [stores](https://svelte.dev/docs#svelte_store) to keep track of the current `locale`, `dictionary` of messages and to `format` messages, we keep everything neat, in sync and easy to use on your svelte files.
2019-05-19 03:59:26 +02:00
2019-11-21 05:51:22 +01:00
**Requirements**
2019-11-21 03:31:31 +01:00
2019-12-03 03:41:34 +01:00
- Node: `>= 11.15.0`
- Browsers: `Chrome 38+`, `Edge 16+`, `Firefox 13+`, `Opera 25+`, `Safari 8+`.
```svelte
<script>
import { _ } from 'svelte-i18n'
</script>
<h1>{$_('page.home.title')}</h1>
<nav>
<a>{$_('page.home.nav', { default: 'Home' })}</a>
<a>{$_('page.about.nav', { default: 'About' })}</a>
<a>{$_('page.contact.nav', { default: 'Contact' })}</a>
</nav>
```
```jsonc
// en.json
{
2019-12-03 03:41:34 +01:00
"page": {
"home": {
"title": "Homepage",
"nav": "Home"
},
"about": {
"title": "About",
"nav": "About"
},
"contact": {
"title": "Contact",
"nav": "Contact Us"
}
}
}
```
- [Documentation](/docs/Getting%20Started.md)
- [Sapper Template](https://github.com/kaisermann/sapper-template-i18n)