mirror of
https://github.com/cupcakearmy/svelte-i18n.git
synced 2024-11-16 09:59:58 +01:00
Internationalization library for Svelte
a8b5df0442
* feat: introduce onMissingMessageHandler * Update src/runtime/types/index.ts Co-authored-by: Christian Kaisermann <christian@kaisermann.me> * Update src/runtime/configs.ts Co-authored-by: Christian Kaisermann <christian@kaisermann.me> * Update src/runtime/types/index.ts Co-authored-by: Christian Kaisermann <christian@kaisermann.me> * Update src/runtime/stores/formatters.ts Co-authored-by: Christian Kaisermann <christian@kaisermann.me> * Update test/runtime/stores/formatters.test.ts Co-authored-by: Christian Kaisermann <christian@kaisermann.me> * Update test/runtime/stores/formatters.test.ts Co-authored-by: Christian Kaisermann <christian@kaisermann.me> * rename to handleMissingKey and optionally use return as default value * rename also in the defaultOptions * test for optional default result from handleMissingKey Co-authored-by: Christian Kaisermann <christian@kaisermann.me> |
||
|---|---|---|
| .github | ||
| docs | ||
| src | ||
| test | ||
| .babelrc | ||
| .editorconfig | ||
| .eslintignore | ||
| .eslintrc | ||
| .gitignore | ||
| .nvmrc | ||
| .prettierrc | ||
| CHANGELOG.md | ||
| LICENSE | ||
| package-lock.json | ||
| package.json | ||
| README.md | ||
| rollup.config.js | ||
| tsconfig.json | ||
| yarn.lock | ||
svelte-i18n
Internationalization for Svelte.
svelte-i18n helps you localize your app using the reactive tools Svelte provides. By using stores 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.
Requirements
- Node:
>= 11.15.0 - Browsers:
Chrome 38+,Edge 16+,Firefox 13+,Opera 25+,Safari 8+.
<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>
// en.json
{
"page": {
"home": {
"title": "Homepage",
"nav": "Home"
},
"about": {
"title": "About",
"nav": "About"
},
"contact": {
"title": "Contact",
"nav": "Contact Us"
}
}
}